Page Builder Everywhere Plugin
Follow the instructions below to install and configure your new product
TABLE OF CONTENTS
✓ Self-Hosted WordPress Installation
Remember: In order for the Page Builder Everywhere Plugin to work, you must have Divi from Elegant Themes. If you do not have it you can purchase it here. Once you have it, please install it on your self-hosted WordPress website.
Page Builder Everywhere brings the extraordinary power of the Divi Builder to new and exciting places. No longer is it only supported on posts, pages, and certain custom post types: wherever text goes, Divi goes!
Turn The Page Builder Into A Website Builder
Page Builder Everywhere lets you use any design you save to the Divi library, in areas that were previously not reachable or editable without significant code changes. New custom built headers, footers, and sidebars are just the start!
The Most User-Friendly Layout Injector For Divi
Page Builder Everywhere’s unique widget powered user interface makes using Divi Layouts in new places a breeze: Choose the design you want, choose where you want it to go and you’re done! It really is that simple.
Introducing the Divi Inserter Button
As well as support for the Divi Builder in non-editable areas, Page Builder Everywhere also empowers you to use Divi Layouts anywhere that supports text, including within WordPress, third party plugins and even other Divi Modules!
Please upload the Page Builder Everywhere Plugin to you your self-hosted WordPress website. Make sure the Divi theme is already installed and activated.
Navigate to Plugins >>and click the "Add New" button.
When the Add Plugins page loads, click on the "Upload Plugin" button.
Choose the .zip archive you downloaded and then click the "Install Now" button.
When the success page loads, click the "Activate Plugin" button.
The plugin is loaded and active, the last step for installation is to register the License key.
C. ENTER LICENSE KEY
After you've activated the plugin you need to access the License Key Information Page to display the licensing dialogue box. Enter your License Key and then hit "Continue".
D. CREATING A LAYOUT
PBE works by adding layouts from the Divi Library in the 5 new widget areas it creates, so first learn how to create a layout in the Library.
Navigate to Divi >> Divi Libary and on the "Add New" button.
The pop-out will show you where to enter a name for the new layout you're creating and the dropdown where to choose a layout type, pick according to your needs.
Click on the "Submit" button
The Divi Builder will display where you can start building your layout.
After you're done, publish or update the layout.
E. PBE WIDGET-READY AREAS AND THE DIVI PBE WIDGET
Navigate to Appearance >> Widgets. The plugin creates five new widget-ready areas to house one or more "Divi PBE Widget".
The five positions are Above Header, Below Header, Above Content, Below Content and Footer.
Add the Widget to any of the new widget-ready areas and use the dropdown to choose an item from the Divi Library.
After you have picked the layout, save the widget.
F. CONDITIONAL LOGIC
The plugin also has the option to choose where to or not to use the newly added layout. Click the "Where" button.
The popout will display the options to display or hide this single widget if the settings match with two columns of possibilities.
G. WP TEXT EDITOR ICON
The plugin now has the ability to place an icon in the Default WP WYSIWYG Text Editor, this means that you can use PBE on any post type or module that works with the default text editor.
Click the icon to "Add" a Divi Library layout.
Choose from the dropdown list, and click OK.
The widget is shown as a rectangle with the Library Item name in the center.
H. PBE IN THE THEME CUSTOMIZER
The plugin creates a new item in the Customizer.
Clicking on the Page Builder Everywhere link reveals three options.
In the PBE - Main Header customizer there are two settings, one to stop the logo from overlapping the section above the header and the other to entirely remove Divi's default main header.
In the PBE - Above Header customizer there's the setting to enable the section to hide on scroll.
In the PBE - Footer customizer there's the setting to hide the bottom footer.