Insert the Columns block
In EasyEditor, drag the Columns block onto the canvas.
Select the block.
In the Settings panel:
For Number of columns, select either one, two, three, or four columns. For more than four columns, enter a custom number in the Custom box.
There's a maximum of 16 columns.
For Visibility, you can choose visibility options for the columns block. Expand the visibility drop-down menu and choose to Show on all devices, Show only on mobile devices, or Show only on desktop devices.
For Mobile device settings, expand the drop-down menu and choose either Stack content or Do not stack content.
Stacking content makes viewing easier on narrower screens.
Select Save.
Edit the column width
To change the width of your columns, drag the divider to the left or right.
Reverse stacking direction on mobile
If you want to reverse the stacking direction of a column block in mobile view, there is a change you can make to the source code of your campaign. The stacking direction is controlled by the dir attribute of the column block. By default, this will be set to ltr (meaning left to right). Changing this to rtl will reverse the direction in which the columns stack on mobile.
These instructions assume some familiarity with HTML. Another option is to use separate columns for mobile and desktop view, with the relevant visibility settings.
To reverse column stacking direction on mobile:
While editing your campaign, select Utilities > Edit source.
Place your cursor inside the code box, then use Ctrl + F (Cmd + F on a Mac) on your keyboard to bring up the search function. Enter a search term which will help you locate the column you want to edit, for example, some of the text it contains, or an image title.
Once you’ve found the correct column, check the code preceding it for
ee-type="container"Data-title="columns", then follow the code until you locate the attributedir="ltr".Edit
ltrto readrtl. Make sure you don’t remove the quotation marks, or make any other changes to the code.
Select EDIT DESIGN to return to the EasyEditor design view.
The column you have edited has reversed direction. Drag the content to its original position to restore your desktop design.
Select PREVIEW > Mobile > Portrait. The stacking direction of the column has reversed.
Note that once you change the stacking direction, you can no longer edit the column widths.