Option to stack a row of 4 columns as 2 x 2 for mobile
in progress
O
Oli Chapman
Our emails are product heavy so we tend to have rows of 4 products. We want to reduce the scroll as much as possible for mobile which is why the option to stack 2 x 2 on mobile would be ideal. We have found a template that does this, but it requires some coding to tweak colours and spacing so having as part of the fantastic Stripo editor would be awesome. Have attached screenshot examples
Photo Viewer
View photos in a modal
Stripo Team
marked this post as
in progress
Stripo Team
Hello Oli,
Thank you for using Stripo and moreover, for caring enough to send us your suggestion.
We genuinely appreciate it.
Our developers have added your request as a future idea.
V
Vladimir Poskrebyshev
Hey Stripo Team,
It looks like this topic is the most popular feature request so far, and for good reason. I truly believe this feature can address some significant challenges. I hope you’ll consider it seriously so we can soon enjoy an even more versatile and powerful Stripo editor! 😊
To support the development, I’d like to share two examples that might help clarify how this feature could work:
Before using Stripo, I worked with the MJML framework, which might already be familiar to your dev team. They have an element called mj-group—an unstackable group of columns. This makes sense in their context since columns stack by default on mobile unless defined otherwise. You can find their documentation here: https://documentation.mjml.io/#mj-group.
The example in their docs is basic, showing only two non-responsive columns (something Stripo can already handle easily). However, a more advanced example in this Medium article (https://medium.com/mjml-making-responsive-email-easy/more-control-over-how-your-columns-display-on-mobile-in-mjml-2-2-0-192f90d33a77) demonstrates exactly what we’re discussing here—4 columns that stack into a 2x2 layout on mobile.
I believe there are two potential ways to implement this feature:
Option 1: Enhance existing structures by adding parameters to define stacking behaviour on mobile. While powerful, this approach might be overly complex.
Option 2: Introduce a new element called "Group" or "Containers Group." This element would function like existing structures and containers (with border, corner, and colour options) but it has multiple columns like structure and the same switch for "Responsive" or "Non-Responsive" behaviour. I think it makes sense to allow adding at least 2-5 columns to groups.
V
Vladimir Poskrebyshev
Stripo Team (continuing from my previous comment) The second approach seems simpler and more flexible. It could address two key pain points:
- The issue raised in this thread—stacking 4 columns into 2x2 on mobile.
- The inability to nest columns within columns (I believe this issue is also a common pain point) – Imagine you need a layout with two columns. The first column contains an image, while the second column has a title (spanning the entire width of the column) and two buttons below it, each occupying half the width of the column.Currently, achieving this requires custom coding shared by your support team, which not all users are comfortable with. A "Group" element would make such layouts intuitive and accessible, adding immense flexibility to the editor.
I’m confident this feature would elevate Stripo’s functionality to a whole new level! It will allow to design simple but required in many templates things. Other users, if you agree, please give my comment a like and keep the momentum going. 😂 Bobby William Victor Bous Mathieu Gagnon @nNiha Boyanapalli Dmytro Kulaksyz Viliam 1 @Charlie Williams Elijah Meyer Григорий Лысенко Oli Chapman
O
Oli Chapman
Vladimir Poskrebyshev 100% agree with all the above! Would take the flexibility of the editor to a whole new level :)
V
Vladimir Poskrebyshev
I agree, would be nice to have possibility of add some responsiveness parameters to each structure: whether it should have one or two columns on mobile. Sometimes it is useful.
As a workaround for Oli: You can create a 4-column structure and make it visible on desktop only. Then you can create a two-column structure, make it visible on mobile devices only, copy the same content to it and make this two-column structure non-responsive => you will get two columns.
Григорий Лысенко
Vladimir Poskrebyshev is not a solution to the problem, since the desktop and mobile versions are an increase in code, which affects the display in GMAIL, for example, which adequately shows only emails up to 104kb in size
V
Vladimir Poskrebyshev
Григорий Лысенко In general, if the email is initially very long and the code is already back to back, then yes. But if there is enough “space”, you can add. This is purely as a way to implement this in the current environment when there are no other built-in ways