How to Create a Global Section in Elementor

If you moved from Elementor beginner to intermediate, you will soon land at the question on how to create “global sections” or “global templates”.

Global widgets are a nice way to re-use specific content elements, but what if you want to re-use complete sections and also want to change the content only once centrally?

We recently helped to build a website with about 40 pages with Elementor, and “global sections” played a role in that project.

In this post, you will learn how global widgets and templates are different, and how you can create “global sections” using the Elementor template feature.

What is a global widget?

Most basic and pro elements can be saved as Global Widgets. The layout components, like sections, inner sections, and columns miss the “save as global” option.

Let’s take a look at an example: Our contact section on our start page looks like this.

The following widgets are used in this section:

  • Image
  • Heading
  • Text
  • Form

You can save each individual element as global.

Screenshot: Global widgets and Save as Global in Elementor

This way, I can use the exact same heading element “Say Hello!” anywhere on our site.

“Global” means that if I change the text from “Say Hello!” to “Say Hi!”, the text will change in all pages that use the global widget. If I click “unlink” when adding the widget to a page, I can edit the content only for that specific heading element. This way the widget is no longer “linked” to the others and the design and content is independent.

Options available when adding a global widget to a page

A heading is not the best example of a global widget. There are more complex elements, like a pricing table, a contact form, or a call to action, that you will save as a global widget.

What is the downside of using global widgets?

If you want to re-create a section of a page, like a contact area shown above, you would have to re-create the layout structure first (a section with two columns), before you can place the global widgets on it. That is a lot of clicks for getting the job done. Then again, if you want to change the contact area on all sites using the global widget, you have to edit all the widgets individually.

Global widgets can be placed anywhere on a page, so you do not have control about column and section level. A Call to Action widget that looks awesome in a sidebar with 400px width might look awful when placed in the full-width footer.

What is a Template in Elementor?

A template is a mix of content elements (Heading, text, form, etc.) and layout components (sections, inner sections, columns). In short, you can save and re-use larger parts of a page, instead of just individual content elements. Sections and inner sections can be saved as templates.

This way of using templates is known by many Elementor users and very obvious.

Saving a section as template in Elementor

A template can then be added on any page in Elementor too, the main difference to global widgets is that these templates are copies of the content and design.

Add Template option in Elementor

Working with templates this (classic) way makes sense if you want to be sure that the exact same design is applied, but the content changes anyway. Imagine a complicated section with multiple inner sections, several columns, and all the settings applied, like padding, margin, colors, and background effects.

To take the same use case, imagine a contact section that changes on different pages. In fictional business area A Rolf is the contact, in business area B it’s Luca, so you will change the picture and other contact details. You could use templates to add the section, and then start customizing the content.

What is the downside of using templates (the classic way)?

If you change the content of a template in one location, that change is not synced to all the other locations on your website that use the same template. That is the main difference to global widgets.

Imagine a website with 50 pages or more built-in Elementor, no way you can edit a phone number, a picture, or a contact form once. Instead, you would have to open 50 pages in Elementor and change each item manually. You will get frustrated. This is where “global sections” come in.

How to create “global sections” using the Template Widget

“Global sections” are put in quotes, because they are not called that officially. It’s natural for us Elementor users to call it that way because we got our head around global widgets first and applied the naming convention to sections.

Your goal: Save templates that behave like global widgets. Here’s how to do it.

There is an Elementor element, and that is called “template”. You may have overseen that until now.

The Template element

There are two reasons why you haven’t paid attention to the Template element:

  • First, you are not using the PRO version of Elementor – the Template element comes only with the Pro version.
  • Second, you simply overlooked it all the time (like I did, for quite some time).

In this short screencast (see below), you can see how I place a template element on an empty page, search for the template I want to place on the page.

After that, I click the preview button and the page loads the template (in a separate browser tab). Notice the whitespace left and right of the contact section. That happens because when you add a template element to a page, a section and column are added by default (you can’t change that). So you need to apply certain settings still on section or column level that hold the template widget.

In the second part of the screencast, I am adapting the section to full-width, and I am also opening the navigator component to show you the structure that is created when adding the template element on an empty page.

Now, notice the “Edit Template” button below the template element. If you click that button and start editing the template and saving your changes, every page holding that template will have the changed content shown!

Compared to global widgets, if I edit the contact section template, I can change the image, the heading, all text, and the form, in one editing process. Once I save those changes all pages holding the template will show the updated content.

The Edit Template Option in template element.

This is not the only way to get to editing your templates of course. In the WordPress dashboard, you can browse to Templates, and start editing your templates without loading Elementor first.

Elementor Templates in WordPress dashboard

In this second screencast, I am showing a page holding a template widget. I am opening the template via WordPress dashboard to edit in Elementor. I am changing the text and the picture, updating the template. Then I am reloading the page holding the template, you can see the changes are shown!

That’s basically it, but there is more to it.

You can save not only individual sections as templates but complete pages. This way you can save multiple sections as one template, and manage large parts of the content in one central place. Imagine not only using a contact section globally but sections with a portfolio, contact, call to action and footer. That makes 4 sections that you could save as one template and re-use on any number of pages in the exact same way.

Save a page as template, option hidden in the bottom left update menu

When to use what?

  • Global Widgets are great for re-using elements that need lots of design customization, like a pricing table, a call to action. Global widgets are not good for re-building sections.

  • Templates can be used in two different way, “local” and “global”
    • Local” or classic: added via the “add template” button in the editing area of Elementor. Great if you want to re-use the design and structure of a section, but not re-use the content throughout the site. The templates added via this way are independent of each other location
    • Global” using the template widget: The way to go if you want to create “global sections”. This way you can re-use both designs and content throughout your complete website.

Confusing User Experience

I think the Elementor team could create a better user experience when re-using elements or sections. The average user might not grasp the difference between global widgets and templates at first, and that there are two different ways on how to use templates. An easy fix would be renaming the template widget to “global template”. This would make immediately clear that templates added via the template widget are managed centrally.

Maybe there is a way to handle global widgets and templates in a more similar way. Right now they are managed in different areas of the page builder and little bit of trial and error is involved in understanding it fully.

Step by Step creation of global sections

  1. Create the section/inner sections and columns, add widgets/content/design
  2. Save the section as a template
  3. Place a template widget (Pro Widget) on the pages you want to show the template
  4. Edit the original template via WordPress Dashboard (Templates)
  5. Check the pages that have the template added and see if the edits are shown

One simple rule:

  • If you add templates to a page via add template button, changes made to the template later on are not synced
Adding a template to a page, the classic way!
  • If you add templates to a page via the template widget, changes you later make are synced
Adding a template to a page, using the template widget

Bonus tip

Every Elementor template has a shortcode and can be added to posts or pages that are not edited in Elementor. Think about adding a call to action in a blog post, or a contact form on a page not created with Elementor.

In WordPress dashboard, you can see the shortcode that you need to add to your post or page to get the template integrated.

Template shortcodes for Elementor templates in WordPress dashboard

Conclusion

Global widgets are a nice way for re-using small elements, but far more important when building larger websites is the template feature in combination with the template widget. You will soon face certain limitations when using global widgets, therefore getting savvy in working with templates is recommended.

Do you want to take a short cut and get in-depth training on how to use Elementor Pro to build your page? Check out our free Elementor Crash Course.

Subscribe to Creators of All Trades newsletter

Discover trending apps and must-reads across social, marketing, productivity, design, tech, and startups. Subscribe now and elevate your game!

57 Responses

  1. Man, spent a lot of time researching and this is the only article I found that explained the difference of adding the template under the section of blocks on the left vs on the page. Nicely done.

  2. I have a section with 2 columns in it. When I place the template widget on a page, the original section merges into 1 column. This creates a problem for mobile viewers… any workarounds?

  3. Thank you, thank you. I’ve been using Elementor for a while, but could not for the life of me make sense of when and how to use my own templates. I knew it had to be here somewhere, but the number of times I created a template to make this work and fail is ridiculous.

    Sections as global templates. That’s all that’s required, to do, call them global templates.

    Now at last I can work with Elementor with confidence and understanding.

  4. I am horribly confused about section templates, even after reading your nice explanation. Can I PAY YOU to screen share with me and teach me what I am missing?

  5. Man, mit der Suche, wie man “Globale Sections” anlegt, habe ich einige Tage verbraten, bis ich (zu meiner Rettung) auf deinen Artikel gestoßen bin!

    Ich kann die Anzahl der Flüche und der Kraftausdrücke gar nicht aufzählen, dass Elementor das Thema “Globale Sections” so schlecht in ihrem Editor aufbereitet hat!

    Dein Vorschlag ist (für den Anfang) auf jeden Fall ein guter Vorschlag!:
    An easy fix would be renaming the template widget to “global template”.

  6. Das vorgenannte Section-Beispiel würde ich gerne wie folgt “erweitern”:
    Nämlich, dass (nur) die genannte (technische) “Grundstruktur” dieser Contact Section als “globale Section” angelegt. (D.h. der konkrete Text/das konkrete Bild für die jeweilige Seite sollte auf der jeweiligen Seite entsprechend dort jeweils auf der Grundstruktur “on top” ergänzt werden können).

    Wunsch:
    Wenn (nur) die (technische) Grundstruktur einer Section als “global” angelegt werden könnte, könnte man später ZENTRAL z.B. die Spalteneinteilung dieser Section oder die Größe des Bildes in der Section verändern und auf allen eingebundenen Seite würden sich die dortigen (individuellen) Texte und das dortige (individuelle) Bild in der Section entsprechend (automatisch) verschieben/verändern.

    Frage:
    Kann eine Section als REIN TECHNISCHE GRUNDSTRUKTUR angelegt werden, die GLEICHZEITIG GLOBAL ist?

    1. I think that is not possible at the moment. The way Elementor is built/works at least not out of the box.
      You chould take a look at Advanced Custom Fields + Elementor.

  7. Awesome!!! I was search exactly for this! Thank you so much from Brazil!
    I’m really thankful!

  8. Excellent Post! Exactly what I needed for my footers and other areas that I’ve spent so much time editing individually in Elementor. Thanks!!

  9. Had NO idea this was even available but thought someone must have made a plugin or figured it out. Turns out it was there all along! Thanks so much for finding this and documenting it!

  10. Hi and thanks for a great post.
    Can I use a local/classic template but inherit the style from the section template?

    The problem I’m facing is that I want to use the same section for multiple pages but with different content. So if I want to change the styling, I would like to do that in one place – a section template.

    Is this possible?

    1. I am not sure if I get the question right, you want to create the design for a section in Elementor, but to add content for the section, the classic/Gutenberg editor should be used?

  11. I have an issue with this feature. So if I add Global Template to my page template.

    Then I create multiple pages using this page template, I cannot edit the content in them separately. I can only directly edit the template.

  12. Thank you for this solution. I royally screwed up creating a sidebar section by copy-pasting a misspelled name across 30+ articles and going back to individually correct the mistake would’ve taken ages. This was exactly what I needed, and now I know more about Elementor’s features. Super thankful.

  13. Very big thank you for this! I have been trying to figure out why some of the 75 product pages that I have created using a template were not updating with changes. Apparently, I have added the template the classic way, and via the template widget in other places. I have an issue though, when adding the classic way, it asks if you want to overwrite the page style with the template style, selecting yes makes everything perfect. When adding via the template widget however, there is no such option and the style is inconsistent…any way of resolving this? Also, any way of using these same global templates on another site, and still having control over editing from the original master? Wouldn’t that be something.

    1. Hey Jeffrey, nice you found that helpful. I am no longer into Elementor – meaning this site still runs on it but I stopped updating my knowledge about it. I suggest you look for elementor forums, I know there are some Facebook (ugh) groups also. Best-rolf

      1. Thank you for the response, and letting me know Rolf. So what have you moved on to now (presuming some other page builder). Just curious. Take good care, J

        1. Right now, still on Elementor. But the new site will run on a custom theme done by a freelance WordPress developer. But Elementor is stil the go-to page builder on WordPress. There are alternatives, but my impression is that Elementor is the leading one.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Elementor Crash Course - Now for $66 FOR FREE

Learn the most important Elementor tips & tricks in 90 minutes.