...
Containers - the outermost element on a page. A page is typically composed of multiple containers such as the header, footer, body containers, etc.
Info | ||
---|---|---|
| ||
You'll want to create new containers for sections that you plan on reusing in other areas of your theme, otherwise, simply adding new sections for additional elements will be sufficient. (For those familiar with the older storefront themes, this is akin to adding new snippet templates.) |
Section - within each container there are one or more sections. A section is a logical grouping of child elements. For example a header container may contain two different sections for a mobile menu bar and a desktop menu bar.
...
The following tools are available.
Icon | Description |
---|---|
Delete this element (and all children) from the hierarchy | |
Edit the settings for this element. | |
Add a child element (only visible if the element supports children) | |
Open/Close (only shown for Modals and Side-panels) | |
Hover over this to display a drop down menu of more advanced tools listed below. | |
Download the element hierarchy from this point as a CJSON file. This can be saved off and used later. | |
Copy the element onto the clipboard. | |
Cut the element out and place on the clipboard. | |
Zero out the margin and padding for the element (and optionally a certain amount of levels lower) | |
Wrap a new parent element around this element. Useful if you forgot to place a link around an image for example. | |
Duplicate the entire element and children. | |
Hide this element. The element will not show when the page loads until something, like a button, triggers the element to show. | |
Add the element to the library. This allows you to save off groups of elements into a reusable building block. |