This feature available on All Plans
Overview
Container Widgets have multiple uses in a campaign. They can organize your widgets into groups for various purposes, such as managing visibility or formatting. The Two Column Layout and Three Column Layout Widgets (which are also containers) can be used to adjust the visual layout of your campaign.
To add one of these widgets to your campaign:
- Click the Container, Two Column Layout, or Three Column Layout icon in the Add Widgets Panel, or
- Drag the icon into your preview area.
Widget Settings
The widget settings popup is where you'll make any necessary changes to your Container Widget.
Renaming the Widget
- Click the pencil icon in the top-left corner (next to the widget name).
- Enter the new name and press Enter.
CSS ID
- The CSS ID (starting with a
#) of your widget is displayed in the top-right corner of the popup.
Customization
- Use the menu on the left side to fully customize your Container Widget.
- Navigate through the sections using the Back and Next buttons at the bottom of the popup.
When finished, click the blue Save and Exit button to apply your changes.
Setup (Column Control)
For Two Column Layout and Three Column Layout Widgets, the Setup section allows you to define column widths.
Adjusting Column Widths
- Use the slider(s) in the bar to adjust the sizing, or
- Enter percentage values directly into the fields below.
Visibility
To control when and where the widget is visible:
- Go to the Visibility section.
- Adjust settings for:
- Date and time restrictions
- Pop-up display
- Builder-only visibility
- Country-specific visibility
For more details, refer to the Widget Visibility Help Doc.
Extras
Learn about the Main Tag, CSS Classes, and Smart Labels settings here.
Nested Containers
Need more columns than the default widgets provide? No problem! You can nest Containers or Layout Widgets inside each other to create the desired structure.
Example:
To create four columns:
- Nest two Two Column Layout Widgets inside another Two Column Layout Widget.
Note:
In the Edit Widgets Column, the layout sections are displayed as follows:
- The topmost section appears on the left side of the screen.
- The bottom-most section appears on the right side, as shown in the provided screenshot.
