Theme Builder

The Theme Builder is a feature that allows you to create custom templates for your website's header, footer, single post, archive pages, shop pages etc. using the Visual Editor.

With the Theme Builder, you can design and customize the various templates for your theme without needing to know any coding or have any technical expertise. You can use it to create templates specific to your brand and style, and apply them to your entire website or to particular pages or posts. The Theme Builder also gives you the ability to preview your templates as you design them, so you can see how they will look on your site before publishing them.

Templates

A Zion Builder template is made from tree components:

  • a Header component

  • a Body component

  • and a Footer component

A template can be applied on any WordPress Page and will overwrite the WordPress default layouts.

Default Template

This template will be applied on every page of your website once you will add components to it.

You will notice that this template cannot be removed or edited on the pages it is applied to because it is applied to all pages by default. It cannot be repositioned either.

Add new templates

You can create new templates and reposition them using drag and drop. If you have two identical templates applied to the same page, the last one will overwrite the first one. Remember that the order in which the templates are applied matters.

For example, you could create a template that changes the header on all website pages using the default template, and then create a second template to overwrite the header on specific pages.

You can add a new template from here:

Select the page the template applies to

  • Add a title for your template

  • Select a page where you want to apply the template

  • Click Save

Adding a component

  • To add a component click on the header, body, or footer component

  • then click "Add new component"

Edit Component

Once the component is created you can edit it by clicking the tree dots and choosing "Edit".

This will open the Visual Editor for you to create the content for your component

Save & Close the component

After you have completed editing your component, it is essential to save your changes before closing the component. Failing to save your edits before closing the component may result in their loss.

Press Save & Publish Page then Close Component

Finally, you can now also save the Theme Builder in order to apply your new templates.

Drag & Drop components

You can use drag and drop to move already created components from the right panel into your templates.

Last updated

Was this helpful?