Skip to content Skip to sidebar Skip to footer

How to Customize Layouts With Elementor

Layout is a tool for creating and customizing headers, footers, and other parts of your website. In this article, we’ll cover the details on how to use Layouts built with Elementor plugin.

Which Layout Is Enabled Right Now

Go to Appearance -> Customize -> Header

(or Footer, depending on which one you want to edit) and in the Header style option, you can see which header Layout is active right now.

elementor

You can also set a specific Layout for an individual page. Go to Pages -> All Pages, select the page you want to customize, and in the Theme Options section choose the necessary Header or Footer style.

elementor2

Where to Edit Layouts?

In order to edit and customize Layouts, go to Layouts -> All Layouts in the WordPress dashboard. Each theme includes a different pre-built set of Layouts.

Open any of them, and click Edit in Elementor.

edit-with-elementor

Layout Shortcodes

Layouts include a collection of specific shortcodes that can help you build headers and footers faster. You can find them in the ThemeREX Addons Layouts panel. The number and variety of shortcodes depend on the ThemeREX Framework version used in the theme.  

trex-addons-layouts

They include the following elements:

  • Menu
  • Shopping Cart
  • Currency
  • Logo
  • Iconed Text
  • Search
  • Featured Image
  • Login
  • Language Switcher
  • Title
  • Widgets

Please note: Some of the elements, such as Language Switcher, Currency and Shopping Cart, require additional plugins to work as intended.

Additional Layout Settings

Layouts include additional settings that are applied to the whole Layout row.

In order to access them, click on the Section settings in Elementor, and open the Custom Layout panel.

layout settings

The additional settings allow you to set up the row type, enable delimiter, make the row sticky by fixing it on the scroll and hide the row on the front page.

You may also check our video tutorial on how to customize layouts. 

For the Updates

Exploring ideas at the intersection of design, code, and technology. Subscribe to our newsletter and always be aware of all the latest updates.

Leave a comment

Download a Free Theme