The site-row / site-col system is designed to control the placement, width, and order of features on a page.
The following Custom CSS Classes can be applied in feature settings to adjust the width and placement of the feature on the page:
- Site-row creates a new row in the column structure. *
- Site-col-1 defines the width of the feature. The width can be adjusted by editing the number component of the CSS. There are twelve settings of feature width, with site-col-12 being full-width within a zone.
- Site-col-full-width forces the feature to the full page width.
- Site-right-block forces a feature to be right aligned.
*Please note that this should only be used when you would like to start a new block of features, for example moving from body content to the footer, and does not need to be applied to create a new line of features.
Sequencing Features
Each feature with site-row CSS applied should have a block in the top right-hand corner with the following:
- Number
- Block position (left / right)
- Row if site-row is applied.
If any of these are not present, your Experience Director should be notified.
The number indicates the feature's placement in a row. Features with site-row applied will always be Feature 1 in that row. Drag and drop features within the zone to change their order.
Features can be stacked adjacent to each other by changing the number element of the site-col- CSS and by adjusting the feature order.
It is worth noting that features will appear in their numerical order on mobile and tablet screens.
Discover more
ONGOING SUPPORT
Need help with anything else?
If you can’t find the answer you’re looking for in our Knowledge Base, there are three ways you can get support: