Jim R Web logo

Elementor Styling ZZZZ, Theme Builder

From: Help / Elementor Editor / Universal settings / Site settings / Configure site settings

Theme Builder: Theme Builder settings are global settings that allow you to set default styling options for various HTML elements, such as Backgrounds, Headings, Buttons, Images, and Form Fields. They are not Elementor-specific but are as general as possible. This is the baseline setting for the site, that comes into play only as a fallback if no specific element definitions were set. See Elementor’s Theme Builder for full details.

Introduction

The Elementor Theme builder is used to create site part templates. These templates append and override the current WordPress theme’s page hierarchy, layout settings, and CSS styles.

From the Elementor Website Theme Builder main screen, you can manage everything from one place. You can view every site part of your website, and ensure it has all the page templates it needs.

You may ask: If I am building a theme, can I export this theme to a zip file and install it on another site as a theme?

The answer is, not directly, in the same terms as hand-coding a traditional WordPress theme. You can, however, use the Import/Export Tools and migrate the Theme Settings or complete content.  

What is the Theme Builder? 

The Theme Builder provides a visual overview of the site elements of your site, helping to guide you through each of the site parts you need to create in order to achieve a complete website. 

Elementor’s Theme Builder lets you customize every fundamental part of your WordPress site without coding including your Header, Footer, Global Pages and Posts, Global Archives and WooCommerce Products and Product Archives.

Using the Theme Builder, you can add new site parts (e.g. add a new Header), edit existing site parts, or delete site parts. Existing site parts include a visual indicator to inform you if a condition is applied to that site part. For example, a Global Post site part template may have a condition to only show for a particular category. A green indicator will let you see at a glance that this site has a condition. A gray indicator is an indication that a site part has no condition set.

How To Access The Theme Builder

There are several ways to access the Theme Builder. Choose whichever is most convenient for you.

Method one: Go to Elementor > Theme Builder from the WordPress admin menu.

Method two: From within any page or post’s Elementor Editor screen, click the hamburger menu in the upper left corner of the Widget Panel, then select Theme Builder in the Settings tab.

Method three: Get quick access to the Theme Builder from any screen by using its keyboard shortcut hotkey combination.

  • On a Mac, click CMD+SHIFT+E to immediately jump to the Theme Builder.
  • On Windows, click CTRL+SHIFT+E to immediately jump to the Theme Builder. 

Theme Builder Main Dashboard

In this screen your existing Site Parts will be shown, if any have been built. Thumbnails for each site part will be auto-generated for you.

Note: Any featured image assigned to a site part will be used as the site part’s screenshot. This enables you to use a thumbnail of your choice, rather than an auto-generated thumbnail, if you prefer.

If no site parts have yet been built, the default thumbnails will be shown for all available site parts.