DocsThe builder
Content, Design and Advanced settings
Every element’s settings are in three tabs: Content for what it says and does, Design for how it looks, and Advanced for motion, interactions, visibility and more.
Select an element and its settings open on the right, on the Content tab. With nothing selected, the right panel shows the settings of the page (or template, popup or Global Block) you’re editing.
Content#
What the element says and does: text, images, links, the heading level, a form’s fields and actions, a loop’s query. Some tips:
- Double-click text on the canvas to edit it in place.
- Text, link, image and attribute fields can show dynamic data — the post title, a custom field, the visitor’s name — from the picker next to the field.
- Links open a picker for pages, posts, category and tag archives, the blog, a section on the page, an email address, a phone number, a file from the Media Library, a popup, or any URL. Links to your own content follow it when its address changes.
- Images open the media picker: your Media Library, free stock photos, or a generated image. See Images, stock photos and AI images.
Design#
How it looks — layout, size, spacing, typography, background, borders, effects and position — per breakpoint and state, on this element or on a shared class. See Style elements with the Design tab.
Advanced#
| Section | What’s there |
|---|---|
| Name in Structure | The element’s name in the Layers panel. |
| Motion | Entrance animation, hover effect and parallax. See Motion and effects. |
| Interactions | Triggers, conditions and actions. See Interactions. |
| Display conditions | Show the element only on some pages, to some visitors or when data matches. See Display conditions. |
| Visibility | Hide this element everywhere; Start hidden (an interaction shows it); Hide on chosen breakpoints; Lock. |
| Analytics | Track clicks on this element, when Analytics is on. See Goals, events and campaigns. |
| Attributes | HTML attributes such as id, aria-label or data-*. |
| Custom code | CSS and JavaScript for this element only, with the Add custom code permission. See Custom code in pages and elements. |
The bottom of the tab shows the element’s ID and type, which you may need for CSS or support.
Page settings#
Press Esc or click an empty area to deselect, and the right panel shows the document’s settings:
- Title and, for pages, the URL slug and Use as the site’s front page.
- Design direction — the brief the AI used when it designed the page, if it did. See Design pages with Design mode.
- Custom code for the page: CSS, JavaScript, head and footer code.
- For templates and popups, where they apply and their rules. See Templates and Popups.
Related articles
On the features pages
Still have a question? Email us at support.