What Is A Global Library Item?
A Global library item is a Module, Row or Section that appears the same on whatever pages it is added to.
You can add a single global module to multiple pages. If you change the global module on one page, it gets updated instantly on all other pages to which it has been added.
A simple use case for this would be a Call To Action Module at the bottom of your website's pages.
If a single module is repeated on multiple pages, making this module Global is very useful. This way, you don't have to edit every page when you want to change it.
Global elements open up many possibilities, especially when you can selectively sync individual settings for each module.
Example: you could create a global Header Module that appears at the top of all of your pages and choose to sync only certain options in the Design and Advanced Tabs
This will allow you to apply custom styling to the entire series of pages using this global header module but still allow you to add unique title text content to each module within the module's Content tab (which has yet to be synced).
If you ever want to adjust the look and feel of these global header modules, you only have to edit the options you chose to be synced once.
Entire sections can also be made into global sections. This is a perfect way to create a custom footer for your entire site and have that footer section mirrored across all of your pages.
If you ever want to change your global footer section, you only have to edit it once, and the changes get applied everywhere the section has been used.
Creating A New Global Library Item
Making a library item global is simple. When saving your library item, check the Save As Global option. Any item that is saved with this option selected becomes a global item.
Global items within the page builder are easily identified by their green color. If you are editing a module, row or section that is green, or if the current modal settings window you have open is green, you know that you are currently editing a global item.
It's important to know when a global item is being edited because any change you make will be mirrored across every page on which that item has been placed.
Global Modules & Selective Sync
As mentioned, you can selectively sync any module settings option when saving a global library item.
Example: If you create a new global module and choose to sync only the Background Color option, then only the Background Color for that module will be mirrored.
What does this mean exactly, and why is it useful?
Let's say you have a Fullwidth Header module at the top of your pages. This is quite common.
Each Header module has a different title in the Content tab to represent the current page. You have also edited the options in the Design tab to give your header a unique look by adjusting the title font color to blue, the title font style to Bold and all Caps, and the title font size to 40px.
You want your header modules on each page to use this unique style, but you need each page to have unique titles. In this case, you can create a Global Fullwidth Header module and selectively sync only those options (font color, font style, and font size).
Now, whenever you add this global module to a new page, these options will be synced, but all of your other options will remain unique for the current module.
If you ever want to change the style of the headers on all your pages, you can modify the synced options for the header text style shared by these global modules, and the changes will be reflected on every single page where the global header has been used!
This same theory could also be applied to the options in the Advanced tab. You created a Slider Module and applied a unique animation to the slider's button. You want to use this new, unique animation on all of the Slider Modules on your website. In this case, you can create a new Global Slider Module and selectively sync the Custom CSS for the Slide Button (which includes your custom CSS animation).
Add this Slider to your page, and you can adjust all other options freely while keeping your unique Custom CSS option synced across the entire series of modules.
If you ever want to adjust the Custom CSS option for this series of global modules, you only have to do it once. Editing the Custom CSS option in one module updates all implementations of this Global Slider Module.
Whenever you edit a global module, you can easily identify which options are synced by the green sync icon on the left of each option.
Options that have the green sync icon are options that are currently being synced within the global module. All instances of the global item share options are edited with green sync icons.
To un-sync an option, click the green sync icon, and you will see the icon turn red. Options with the red sync icon are NOT currently synced within the global module.