Elementor Control Panel Explained in 3 minutes

Facebook
Pinterest
Twitter
LinkedIn

If you have just gone through 3 Ways to edit a WordPress page with Elementor then you are ready to start designing web pages in Elementor! If you haven’t gone through the previous tutorial I highly recommend checking out the ways to edit Elementor blog post before going over this tutorial.

The Elementor control panel is extremely easy to learn and it will make building and designing pages a breeze! First, let’s get started with getting familiar with the basic navigation of the control panel.


The Top Navigation

The icon on the left will take you to the page’s settings, and the icon on the right will take you to the Elementor Widgets Area, where you can select elements to add into your site.


Elementor Page Settings

Style

The Style settings are where you’re going to have control over how the global style settings will function across all the pages built with Elementor. You have access to customize the following areas of the builder:

  • Default Colors
    • Select the default colors to be displayed for the generic elementor templates and widgets used to build web pages.
  • Default Fonts
    • Select the default fonts to be displayed throughout all of the pages built with Elementor.
  • Color Picker
    • Customize the colors that are available throughout the entire page builder. This is handy when you are trying to stay on brand. Pre-loading your brand’s colors here will streamline design.

Settings

This is the Style settings that can also be found in the WordPress backend. We discussed these settings in our blog post Elementor Settings in WordPress Explained in 3 minutes.

Go To

  • Finder
    • Elementor’s Finder is a game-changing shortcut that allows the user to navigate to their pages and templates built with Elementor. You can access it here, or simply by using the keyboard shortcuts below
      • Mac: CMD + CTRL + E
      • Windows: CTRL E
  • View Page
    • Just simply pulls up your page in another browser tab.
  • Exit to Dashboard
    • Exits back to WordPress

Bottom Navigation

The bottom navigation has some very practical tools that make design web pages really easy.

  • Gear Icon
    • Allows you to edit every page’s single settings. (ie Title, page layout, status, page background color/type, padding, and custom CSS.)
    • You can also adjust “Preview Settings” here if you are working on a theme template.

  • Stack Icon
    • This launches the Elementor navigator which can be a handy tool when navigating your page’s different sections and elements. We will have a post dedicated to the navigator and how to properly use it.
  • Clock Arrow Icon
    • This is where you can find the current list of revisions and undo changes.
  • Mobile Phone Icon
    • Click on this icon to view the Elementor Builder into a tablet or mobile. It automatically converts all of your widget’s styles to tablet or mobile. In reverse, you can also go back to desktop view when clicking here.

Eye Icon

Opens up a preview tab that will auto-reload the page after you make updates in Elementor.

Update Button

After making changes to the page in Elementor, this button will light up green. Click Update to update your pages changes. Click the arrow key on the right-hand side of the button to display these options:

  • Save Draft ( To be published live later )
  • Display Conditions ( Only for global templates )
  • Save as Template ( To be reused from your Elementor Template Library )
Andrew Hewitt | Yoh Digital

Andrew Hewitt | Yoh Digital

I help creative agencies, project managers, and marketing consultants with building their client's web projects. I'm currently the owner of a small web development firm located in Winston-Salem, and I'm constantly on the lookout to connect with like-minded developers and creatives who love what they do.

Leave a Replay

Recent Posts

About Yoh Digital

Yoh Digital is on a mission to help creative agencies, project managers, and marketing consultants deliver quality web development projects that meet their client’s expectations.

We are passionate about helping our clients succeed, and we are grateful to be a part of their team.

Follow Us

Sign up for our Newsletter

What Type of Services?