Builder

Element Properties

Select any element on the page and fine-tune it, its text, classes, design, layout, and more, from the Element Properties panel, by hand or with Buddy.

Every element on your page can be edited directly. Hover an element on the canvas and a small toolbar appears with two options: edit and delete.

Edit (pencil). Open the element's Properties panel to customize it.
Delete (trash). Remove the element from the page.

The Properties panel

Click the edit (pencil) icon and the Properties panel opens on the right. It has two tabs, Controls and Inspector, an Ask Buddy bar, and a set of collapsible sections for everything about the element. A Reset button at the bottom returns the element to its defaults.

Edit with Buddy

At the top of the panel is an Ask Buddy… bar. Instead of adjusting the controls yourself, describe the change you want (for example make this heading bigger and center it) and Buddy updates the element for you.

Use Ask Buddy for quick changes, and the sections below for precise, manual control.

Element Info

The Element Info section shows the element's Text Content and its CSS classes. Edit the text, and add or remove classes on the element.

CSS Class

The CSS Class section shows the classes on the element and lets you edit the CSS rule for a class. Changes to a class apply to every element using that class in the block.

Design

The Design section styles the element visually:

Typography, size, weight, line height, spacing, text color, alignment, decoration, transform, and style (Normal / Italic).
Background, the fill color.
Borders, radius, width, color, and style.
Shadow, box shadow.

The Design section with typography, background, and border controls

Layout

The Layout section controls how the element is placed and sized:

Display, Block, Flex, or Grid.
Spacing, padding and margin.
Size, width, height, and min/max width.
Position, position and z-index.

The Layout section with display, spacing, size, and position controls

Advanced

The Advanced section is for finer control:

Opacity, Overflow, Cursor, and Visibility.
Transition and Transform.
Custom CSS, write CSS that applies to this element only.

The Advanced section with opacity, overflow, transition, transform, and Custom CSS

Custom CSS here is an inline style, it applies to this element only and overrides the class rules.

After editing an element, remember to Publish (Save & Publish) so your changes go live on your store.

Blocks

Browse and add ready-made content blocks to your pages, dynamic data blocks, static sections, and basic elements, from the Builder's Blocks panel.

Version History

Review previous versions of your store and restore an earlier one whenever you need to.