Elements are the building blocks of your pages: headings, images, galleries, forms, shops and more. Open Add Elements in the editor and drag one onto your page.
There are 37 elements, grouped exactly as you'll find them in the panel.
Basic#
The everyday building blocks.
| Element | What it does |
|---|---|
| Heading | A styled page heading |
| Content | Rich text: paragraphs, lists and links |
| Image | A single picture |
| Hero | A full-width banner with a headline and buttons (Beta) |
| Banner / Slider | The original banner and slideshow element |
| Video | An uploaded, YouTube or Vimeo video |
| Music / Podcasts | An audio or podcast player |
| Button | A call-to-action button |
| Forms | A contact or enquiry form |
| Search | A search box for your site |
| Map | A Google map showing your location |
| Testimonials | Customer quotes, as a carousel, grid or video wall |
| Separator | A dividing line or a gap |
| Table of contents | Automatic links to the headings on a page |
| Menu | A food or drinks menu |
| Booking Plugins | An embedded booking system |
| Integrations | Third-party embeds and custom code |
| PayPal button | A standalone one-off payment button |
| Shop | Your online shop |
| Shop Products | A selection of products anywhere on your site |
| Calculators | An interactive calculator (Business plan) |
| Charts | Data as a chart or graph (Business plan) |
Advanced Content#
Ways to fit a lot of information into a small space.
| Element | What it does |
|---|---|
| Accordion | Collapsible sections, ideal for FAQs |
| Tabs | Content panes switched by tabs |
| List | Titled items side by side |
| Definition List | Terms with their explanations |
| Image Accordion | A large image paired with expandable text |
Box Layouts#
Ready-made image-and-text combinations.
| Element | What it does |
|---|---|
| Text next to image | Side by side |
| Text over image | Text laid over the picture |
| Text under image | Caption-style |
Gallery#
| Element | What it does |
|---|---|
| Grid | A wall of photos visitors can enlarge and filter |
| Spotlight | A grid that expands into full-screen profiles or case studies |
| Before and After | A slider comparing two images |
Blog#
| Element | What it does |
|---|---|
| Blog summary / feed | Your latest posts |
| Blog archive | Posts by date |
| Blog categories list | Links to your categories |
| Blog tags list | Links to your tags |
Working with elements#
- Adding: open Add Elements, then drag an element onto the page, or use the search box at the top to find one by name
- Editing: hover an element and click the pencil icon to open its settings panel. Many elements also let you click text directly on the page to edit it.
- Styling: hover and click the palette icon to jump straight to the styling options
- Moving: drag the element by its handle
- Duplicating: use the duplicate icon on the element's toolbar
- Deleting: use the bin icon. If you delete something by mistake, undo it before saving.
Tips#
- Most panels have Desktop and Mobile options at the top. Check both before publishing.
- Changes are previewed live but only go public when you save the page.
- Search the panel. Typing part of a name is faster than scrolling. Typing 'content', for example, brings up all the Advanced Content elements together.
- Calculators and Charts need the Business plan. Everything else is available on every plan.