Overview

Sections are pre-built rows of elements which users can add to their responsive websites. Sections enable users to build great looking sites quickly by saving time during the design process. We have built the sections’ infrastructure from the ground-up in order to provide a much better user experience with a huge variety of pre-made sections.

Guide

When hovering between rows, an ‘Add Section’ button appears. Click this button to open Section Mode.

In Section Mode, a gallery of pre-made sections is available on the left-bar, grouped into categories (Intro, Features, About, Team, Testimonials, etc).

Click on a section to display it as a new row. You can then browse sections within the same sections group by using the arrows keys or by selecting a section from a different group.

After picking a section, click ‘Done’ to embed the section into the site or click 'Save and Add Another' to continue adding sections to your site. The section is converted into a row and all elements can be edited. 

Considerations

• There is no use of any custom CSS in any of the sections - they are all built within the editor by designers.
• Sections do not use the text-color or text-font settings from the global design settings
• Depending on the section you are using, it may pull the text-size setting from the global design settings. By not applying the global design, we make sure the section looks good. If we would apply automatically the global design, it could make the design of the section incoherent (e.g. if the font color is white in the global design and that the section background is white, the text would be unreadable). You will always be able to clear the format and apply your global design.
• Sections may contain more than one row.
• Sections cannot be used in the header. To switch the full header section, go to the header editor and select a new one.
• Sections are not fully localized. The feature can be enabled/disabled via a feature flag on the account level.
• Sections are not available for sidebar templates (e.g. Portfolio, Milk and Cookies, etc.)