Global Widget (Pro)

This tutorial explains about using the unique Global widget. 

What is a Global widget?

A Global widget gives you full control over a specific widget, that is displayed in multiple places on your site. Editing it in one place will instantly update the rest. It saves you the time and effort of going through the many pages on your site, and updating the content manually, one by one.

How it works?

I'd like to add the testimonial widget on other areas on my site, which is why I'll save it as a global widget. 

Create global widget

1. Hover over the widget.

2. Click on the save icon.

3. Name it. For example: 'Featured Testimonial'. Press save.

Edit global widget

Once the widget is saved as a global widget it is instantly surrounded by a yellow border instead of the standard blue border. In addition, in the panel, all of the saved global widgets are displayed as a two column widget list. 

1. If I click on the edit icon on the widget, I don't get the standard Elementor panel on the left. Instead, I get the message reminding me that this is a global widget and is now locked.

2. The first button is 'Edit global widget'. This allows me to edit the global widget. Any change I make here will instantly update all the places I set the global widget on my site.

3. The second button is 'Unlink from global'. This will unlink the widget from the rest of the global widgets, and let you edit only the specific widget, without affecting all other global widgets.  So after unlinking the 'Featured Testimonial' I created, I'll be able to change the specific widget, because it is unlinked from the rest of the global widgets. All other 'Featured Testimonial' widgets that I placed on my site will still be linked together as global widgets and can still be edited from one place. The unlinked widget returns to behave just like a regular widget, with the blue border and standard edit panel.

How to insert a global widget into another place on my site

I'd like to insert the 'Featured Testimonial' into another area on my site. On the destination page where I'd like to insert the global widget, I head over to the global tab, and drag and drop in the 'Featured Testimonial' widget. Once dragged in, you'll notice the yellow border and global left panel we mentioned earlier. Now, I can edit the 'Featured Testimonial' widget on this page, and have it instantly update on the previous page I was in a second ago.

I click on the edit button, and start customizing the widget. Change the image, the name and the job. I save the page, and head over to the first page. The testimonial has updated there as well.

Think about the possibilities this widget enables: Forms, call to action areas, featured posts... All can be set in different areas in the site, and controlled from one place. This is a significant time saving tools for web designers.

Add a global widget through the WordPress widgets area

Using the WordPress widgets area to add global widgets to the site opens the possibilities of this widget even further. 

1. Go to appearance > Widgets. 

2. Add the Elementor Library widget to any widget area, the footer for example. 

3. Now, choose the template or global widget that I'd like to display in the footer. I'll choose the 'Featured Testimonial' we created earlier. Save it.

That's it, now the global widget is set inside the footer.

Add global widget to any area that supports shortcodes

The flexible options for the global widget are also available with shortcodes. If I go to the Dashboard > Elementor > My Library, I can notice that each global widget has a shortcode.

For example, I can insert the 'Featured Testimonial' global widget to a post I'm writing simply by adding the shortcode.

How to delete the global widget

Simply go to the 'My Library' and delete the widget. Notice that deleting a global widget will delete it from all the places where we've placed it.

 Global Sections and Pages:

It is possible to turn sections to global sections.

You have to save your section as a template first.

Then on any page, you can use the "Template widget" and modify it. When you edit it, it will modify this section in all the pages in which you use it.

To turn pages to global pages, you have to follow the same procedure. Check first how it is possible to save pages as templates: https://docs.elementor.com/article/60-library.