As you might know by now, with the Divi Areas Pro Plugin, you can do so much more than just Popups. Whether you need a popup, fly-in notification, or hover notification, the Divi Areas Pro plugin makes it all possible.
In fact, Divi Areas Pro allows you to create 4 different types of layouts. Without further ado, let’s examine the 4 different types of Divi Areas Pro layouts as integral parts of the Layout Library.
The possibilities with Divi Areas Pro are endless, especially with ready-made templates at your disposal. Let’s learn how to enable our Divi Areas Pro Library and what are the most important layouts today!
Table of Contents
- Enabling the Divi Areas Pro Layout Library
- Using the Divi Areas Pro Layouts Library
- Hover Areas
- Inline Areas
- Over to You
Enabling the Divi Areas Pro Layout Library
Before you can use our Layout Library, you need to install it and enable it on your Divi website.
Luckily, the process is pretty straightforward:
- Navigate to the Divi Areas Settings page in your wp-admin dashboard.
- On the Settings page, choose the “Layout Library” tab.
- Turn the flag “Enable the Layout Library” to “Yes”.
- Save the Settings and wait a minute or two while the templates are downloaded.
Once the Layout Library is enabled, every available Layout template will be downloaded to your Divi website so you can use them for your Divi Areas.
Using the Divi Areas Pro Layouts Library
After you enable the Layouts Library and each of the available templates are installed to your Divi website, go through the following steps to make sure that you’ll be able to use any template:
- Create a new Divi Area (or open an existing one)
- Click on the “Load From Library” button in the Visual Builder header (‘+’ icon)
- Once the Library modal has loaded, you will see the new tab “Divi Areas“. Switch to that tab.
- Now all available templates are visible to you. With a single click, any template can be imported to your Divi Area editor.
- Customize the template according to your needs, double-check that the Automatic Triggers are set, and publish the Area.
The Divi Areas Pro Popup layout is the most popular layout type, which means that most clients use popups to display important notifications, promotions, and invite page visitors to subscribe for their newsletters.
People will use a Fly-in for email sign-ups or other notifications. Fly-ins do not show an overlay and do not block the page.
They stick to any side or corner of your screen, and Divi Areas Pro allows you to choose where you want to add the fly-in on your site. Better yet, users will still be able to scroll through the page while the Fly-in is showing.
Creating a Fly-In is effortless. Start by creating a brand-new Divi Area, where in the Area Settings, you’ll choose the ‘Fly-In’ layout type:
Next up, you need to choose your automatic trigger in the ‘Trigger’ section of the settings, which can be either ‘On Click’ ‘Hover’, or a valid main menu CSS Selector:
In the Layout settings, you’ll also find the ‘Area Alignment’ feature as well. Here, you can choose on which place on the screen the Fly-In area would appear:
Creating a Fly-In is that easy. All you have to do later is use the Divi Builder to set up the Fly-In design and text elements.
Hover Areas are always positioned next to a trigger element. The Hover Areas layout is similar to a Tooltip, and they can be used for example, displaying mega menus.
To learn more about Hover Areas and how to use them with the Layout Library, read Introducing Hover Areas and Template Library Support.
Inline Areas display content in a normal section, somewhere inside a page, and are excellent for positioning and posting ads, or conditional content.
Over to You
There you have it! The Divi Areas Pro Layout Library offers endless possibilities and layouts to grow your website and improve your conversion rate. With only little customization, you can use Areas Pro for any Divi area your heart desires.
Using a plugin such as Divi Areas Pro doesn’t require any coding experience, which means that you can start creating high-converting popups quickly and easily!