It is incredibly versatile & flexible. Bend it to create any type of popup, modal, or content overlay for your website.
Follow this documentation for creating a new popup
Please follow these following steps:
Step 1. Find the Popup extensions
Go to your WordPress website dashboard then find and click the “Brain Plugins” go to the Popups.
Dashboard > DiviConkit> Popups
Step 2. Add New popup
Click the “Add New Popup” Button
Click > Add New Popup
This page will appear!
Step 3. Add Title for the Popup
Then add the title name of your popup. In our case title name of our popup is TEMP
Step 4. Add new condition and where popup will be visible
From the add new condition, you can decide where your popup will be visible.
Include > Entire sites (Popup will visible on the Entire Website)
Pages
All ( If you choose “All”, this popup will visible on all pages)
Or
You can select a Specific page name for showing the popup
Step 5. You Can Add Multiple Condition
You can add multiple display conditions for the popup
Click “Add New Condition” > Add condition
In our case, we Exclude a specific page “Blog” (Blog page title) on the “Blog” this Popup will not visible.
And our example case
- Exclude (The popup will not visible)
- Pages
- Blog (Page name)
Step 6. Click the Publish Button
After complete all of those steps (step 1 to step 5) click the Publish button.
Then wait for few seconds.
Step 7. use Divi Builder
After completing those upper steps, click the “Use Divi Builder” button.
Step 8. Choose the Builder Page Option
Then this page will appear. Select the builder page option. In our case, we selected “Build From Scratch”
Step 9. Build and Design your Popup
Then this screen will appear.
Click the Page Settings
On the Page settings, you will find three Tabs.
- Content
- Design
- Advanced
You will find many toggle options. Select the options and settings that go with your Popup design.
Some of the animations support time delay settings.
Go to the design tab
Due to cache, the builder will not show you the live changes. For seeing the changes you have to click the Save button and reload the page.
Customize your popup width and you can customize the height also.
Select Popup Overly color
After complete the settings. Then add a new row
Remember due to cache, the builder will not show you the live changes. For seeing the changes you have to click the Save button and reload the page.
Add a new row
Remember due to cache, the builder will not show you the live changes. For seeing the changes you have to click the Save button and reload the page.
Add a module, go to the module settings. The way you work on a Divi page when you design a webpage, the same following procedure you can do the popup design.
Step 10. Final
After complete the popup design. Go to your webpage where you have given the display permission, and see your designed popup.
You can see how many popups you have made and you can edit the popup after the building
For seeing the Popup list go to the Dashboard > Brain Plugins > Popups
For editing the popup
- Edit: This will bring you from the beginning page. If you want to change the popup name, display condition then you should go there.
- Edit With Divi: It will bring you the popup design page. If you want to change the popup design, you should go there.
If you find anything hard to understand, then please contact our support. Thank you.