Introducing the Divi Popup Modal Module for Divi. The ability to make a modal/popup using Divi has been missing for a LONG time. This plugin does just that. It’s based on the wildly popular Colorbox jQuery library and features a bespoke Divi Builder module which will allow you to define both the content of the popup and the trigger element. For example a button or image (configurable) and a video/image/layout based popup. It’s very easy to use, watch the video for further/more detailed instructions (plugin has been updated a LOT since the video was made). You have control over the styles of the trigger and the popup itself. The popup (often called a lightbox) has optional controls for responsiveness as well (width and height settings at tablet and mobile sizes for extra flexibility..
Trigger Types
A trigger is what causes the popup to show. These can be as simple as a text link, image or button but may also be more advanced such as showing on page load or showing if an element with a specific class or ID is clicked. More triggers are being added all the time so by all means suggest what you’d like to see and it can be integrated into the next version 🙂
Each trigger is fully configurable and can be styled very easily.
- Image
- Button
- CSS Class/ID
- On page load (with optional delay)
- Exit Intent – when the user tries to close the browser
- Scroll Delay – when the user gets to a certain % of the way down the page
- On Blur – much like class/ID except this fires when your user clicks out of a field
Popup Styles
There are a selection of predefined popup styles which can be configured on a per popup basis. This causes the popup to use a different set of CSS rules therefore giving your popups a set skin/brand very easily.
The newest is called ‘Theme Style’ and it takes the ‘Accent Color’ from your Divi Customizer and uses that as the background color along with a clean and modern lightbox window. See screenshot below for an example.
Popup/Modal Content
Within the popup/modal window you can show a variety of types of content. Out of the box the system supports some simple formats such as video or image but also it can do a lot more such as using a Divi Builder layout or an iFrame.
The current list of supported content types is as follows. As with triggers, if you’d like to see this support a different type of content then please let me know.
- Video
- Image
- Layout
- Content
- iFrame
See the screenshots for how these look on the example site
Usage instructions
- Visit plugins > add new
- Upload the plugin and activate
- Visit any page with a page builder
- Add the module called ‘Popup Builder’
- Choose your trigger and modal content from the options within the module
- Configure using the settings, CSS and/or the Advanced Design Settings tab within the module.
Note
Layouts are subject to responsive rules and may look slightly different in terms of widths and spacing on occasion. Width and Height settings are provided but I suggest you test the popup and tune the output using the advanced design settings before releasing pages to the public.
This plugin is based on the wildly popular Colorbox jQuery plugin.
For any support issues, please visit this link http://docs.tortoise-it.co.uk/
162 Comments
Submit a Comment
You must be logged in to post a comment.
This site uses Akismet to reduce spam. Learn how your comment data is processed.
Changelog:
* * < V1.4 * - Initial Release * * V1.5 * - Fixed responsive text size/line height issues * - Added more configuration options in advanced design settings across all modules * * V1.6 * - Better support for video popup types * - More trigger styles/CSS * - Support added for px and % sizing * * V1.7 (08/02/18) * - Moved init hook to builder ready to avoid conflicts * - Moved editable fields to new builder groups for a better experience * - Added new triggers - exit intent, scroll % and on blur of input element * - Added new responsive styling options (tablet and mobile width/height settings) * - Renamed module from Modal / Popup Builder to just Popup Builder * - Added Licensing/Auto Update * - Added 'Theme Style' skin which picks up accent color from the theme and uses a more modern style * * * V1.8 (05/04/18) * - Added URL parameter for page load option * - Fixed iframe when used in class/id trigger *This theme, layout or plugin is comprised of two parts.
1. The PHP code and integrated HTML are licensed under the General Public
License (GPL). You will find a copy of the GPL in the same directory as this
license file.
2. All other parts, including but not limited to the CSS code, images and design are
copyrighted by the vendor concerned and are NOT licensed under GPL.
This license allows the item to be used in projects for either personal or commercial use by you or on behalf of a client. The item cannot be offered for resale either on its own, in part, or as part of a larger project including that being part of a hosting offer. Distribution of source files is not permitted.
We understand that there can be issues whilst utilizing out of date browsers. Please ensure you use up to date browsers when using our vendor’s products. For DIVI Theme – Third Party Plugins may not perform as desired in the Divi Visual Builder if this is the case, please use the classic builder. We are working with our vendors to rectify this situation as quickly as possible. With the release of Divi 3.1 developer documentation and SOME support of third-party modules and plugins are now accessible through the visual builder.
Please be aware that you will need an amount of experience in the master theme that you are using in order to take advantage of our themes and plugins.
Please make your decision to purchase based upon your skill level to see if our products fit your needs. Due to the nature of Digital Downloads, Refunds are not possible unless the plugin or theme is unusable in your set up – we will require proof of this – please ensure that the product you are buying will do the job you want it too. In the case of Divi and Visual Builder compatibility – some plugins do not yet have 100% VB compatibility. Please check descriptions thoroughly to ascertain VB compatibility. Whilst every effort is made by our vendors to ensure compatibility with other themes, plugins and or web servers. This can never be guaranteed due to the many thousands of iterations in the wild. Please do not be afraid to ask the vendor for support by visiting the product page and clicking the relevant link. Warranty for fitness of products used on your installation is neither given nor implied.
*Support is provided by vendors directly.
You have questions about your purchased plugin, theme or layout? Then use this form to get your answers as soon as possible. If you have a license key, please enter it here. You can find it in your account under "view details and downloads". Otherwise, please use the invoice id from your invoice.
Hi was looking for an alternative to Divi Overlay which keeps breaking for no reason even with no updates ran. Seems though from reading some comments this plugin suffers from similar issues. I am willing to try it but it is concerning that there has been no activity on here for 3 months. Can anyone confirm if this product is regularly updated and how support is? Or if the developer is still active?
Divi Overlays if far more powerful. If you are looking for similar effects. I recommend https://elegantmarketplace.com/downloads/divi-lightbox-anypage-module/
Yeah, I just purchased the plugin and WP keeps saying it is not compatible. The plugin is not functioning as it was promised. I’m disappointed as I need a solution ASAP. So I’ll probably have to go elsewhere….
You can use the plugin in classic mode – go to divi>options>enable classic builder. The content is not visible in the divi visual builder – this is the case for 95% of all third party plugins for Divi.
I just bought the Plugin but it is not compatible with the new divi builder. Are you planning an update? The text and buttons custom options are not working Thanks
I have the same problem but it wants me to renew the support just to ask a question i shouldn’t need to be asking. How about supporting your product and update it!
You can always go to the support directly here: If your license has run out, you can purchase support at 50% of the original cost. https://tortoiseit.freshdesk.com/
Hey, I got a problem, with the popup builder. I want to open Content, I added some text and an image, but the lightbox is empty. If I want to open a video, an image or a layout it works fine. What am I doing wrong?
Greetings
hello when the plugin will be compatible with divi visual builder?
I am trying to get it to work with a Gravity Form right now. I’m all set except that when the “submit” button is clicked, the modal automatically closes. That means the user gets no confirmation that their message was sent. Even if they missed a field, the modal closes. There is some sort of close trigger built into the modal that’s overlapping with something on the submit button, and I haven’t figured it out yet.
Greetings – I put in a support ticket, but they told me to post here. (Ticket: redacted)
I like the popup modal but there are two problems I’m running into.
First, I can’t turn off the icon that appears in the button box even though I click “Show Button Icon” and turn it to NO. It still appears in the button no matter what I do.
Second, the Divi visual builder doesn’t work with the module which makes it extremely cumbersome to use.
Any help would be appreciated especially on #1.
Matt
YOU need to click on the scroll here text at the top of the page to access the support form.
Hi my site says there is a upgrade but it won’t upgrade . Do I need to buy the plugin again. It is asking that my divi api key be added which it already is. So I’m not sure where the block is happening. I even created a new api key just for this site. Thanks for any help.
Go to your account and download from there and reinstall by deleting the Old plug-in you won’t lose any data but it’s always best to make it back up before making any changes to a WordPress install
thanks, I’ll give it a try
it seems to have updated now thanks
Love it, works perfectly, but as a feature request it would be great if you could name each module. They just are called Popup Builder, so I have to go into each one to see what the content is. If I could name it, “Swordfish video” for example, that would be a huge help.
You can do this. There is an admin label option in the settings. Just change that. unless I removed it accident 🙂
Hi, great job!
but i have a problem with image. Its not show.
thank
hmmm just bought it and I noticed I can put a javascript embed code into it? and for some weird reason, I cannot get back it to edit it. Is this normal, create it and then never edit it again?
No this is, not normal behaviour,. Please start a support ticket on https://tortoise-it.co.uk
Hi. I’d like to use the plugin to show a popup after a Divi contact form has successfully been submitted. ie – I’d like the success message to show up in a popup. Is this possible?
Hello. Just bought this plugin and I’m wondering if there’s a way to add new styles to the 4 already created. I found a few mentions to “Style 1”, etc. on divi_popup_builder.php, but don’t know if there’s any guide out there, or if anyone else had the same idea before. Thank you.
I bought and installed this plugin on a site I’m building for a client (algebraixdata.com). It’s now happened twice that the HTML somehow transfers itself from the “text” tab in the WP backend into the “visual” tab, resulting in the popup showing a whole bunch of HTML code. I was able to fix it by copying everything in the visual tab back into the text tab. But anytime there’s a change made to the page, all the modules seem to default back to this error’ed state—which then means having to go through and fix the whole thing again. This seems to be a fault with the plugin as it doesn’t happen anywhere else on the site.
Can this plugin be used to provide a popup rather than go to the Divi no-results page when a search does not return any results?
The pop up iframe will not work if I am using a class or id to make it happen. Like wanted to use a call to action button and then I gave it a class name. Then when I put the class name in the pop up it comes up blank. It works if I use a button within the pop up mod but then I cannot make the button as cool with the data icon hover.
the IFrame on mine does not work. It just comes up with a blank white screen. Any idea why?
Hi
I want the popup to open when the mouse hovers on a particular image. Is it possible with Divi Popup Module?
I’ve read through the comments and have seen the question regarding adding a corner radius (and icon) come up a few times, but haven’t seen an answer I can use yet. I need to make this happen so my modal trigger button matches the rest of the buttons on my site. It seems the only way to make this happen is through CSS styling. I’m not familiar with how to do this or what code to use. Could you please provide some specific instructions and the specific code needed to make this happen? Better yet, it would be really great if this feature was included as part of the normal setup and customization controls.
Hello. The plugin was working 2 days ago and now when the button is clicked nothing pops up..Not sure why?
Thanks
Jen
This may be due to the latest divi updates. Please ask for support here: http://docs.tortoise-it.co.uk/
I also have one more question, is there an easy way of getting the link direct to a popup window? So lets say I type in in my browser http://www.example.com/#popup1 and instead of homepage I go straight to the popup window? I tried anchoring by assigning an ID to the header of the content but either content/editor and layout source won’t work. Thanks for any help.
Any chance to get some help with that? Thanks!
Hello,
I have a grid of 16(4×4) blurbs with popup triggered using a class. The popups source is layout, now the problem is the page is taking longer than expected to load. Usually about 15-20s. At first it loads normally, once all the content is visible the page freezes for about 15s than all is back to normal. I tried with content/editor as a source and there are no issues. Noted also that the issue is handled better in Chrome, there is no delay, although I can see/hear higher CPU usage. The layouts aren’t heavy on content, simple header image and few blurbs. I can’t find anything suspiscious on the browser console either. The question is can you confirm I can safely use 16 layout based popups on one page without any issues?
Hi, After the divi update the button will not align to the center. Is there a solution to this issue ?
Thanks!
Jose
The developers are working on a solution and it will be released ASAP .
Hi,
I want to popup a page from within the website which I am able to do using iframe but it shows the site header within the popup page and this will confuse the visitors which I want to hide, how do i do that ? and also the “x” close mark I want to show on top right instead of the bottom.
Can you please let me know how to do this, thanks in advance for your help.
Thanks
Hi! Thank you for your module.
Just came across a problem – modal content turns into text of HTML if the containing page had visual builder enabled.
Is this a known issue?
Will this work on a PDF?
we are afraid not.
Hi there
Just to let you know I can’t see any difference between the 4 styles. Am I missing something ?
I just purchased and installed Divi Popup Module, and the setup of my first popup was easy. However, the content does not show on my pop up. It pops up, but then the status circle just spins and spins. The only content I wanted in the pop up is text, which I put in the Text Editor in the module. What could be wrong? https://www.screencast.com/t/T10xkVTz
Never mind. I just had the wrong type of content chosen. (sorry.)
Easily done, glad its all sorted and thanks for your support.
Hi there, a few pre-purchase questions:
1. Do the pop ups work in mobile environments? The Vimeo example wouldn’t play on Android.
2. Could I use the Divi pop up modal module to display (and play) Instagram content, or Twitter content, or Facebook content?
3. The main thing for me is that the popups display and play responsively in mobile views.
Thanks, Isla
For a website i’m working on, the image popup is not working. He is putting my whole site into the popup instead of the image i’ve chosen. Please help…
Hello all!
is it posible to freeze the page background (not being scrollable) when pop up is opened?
Thanks,
Chris
It is not with this plugin but you can use this one to do that – 🙂 https://elegantmarketplace.com/downloads/multi-modal/
I am having this issue your link goes to a 404 page btw. I need help with this please.
There doesn’t seem to be a way to stop the body of the main page from scrolling when the modal is open. I should just be able to add an overflow: hidden; style to something but I can’t figure out where to add this.
Here is an issue I found with this plugin and may help/save someone time in finding and fixing it.
I was using this on my site and notice that my menu drop down arrow and my back to the top arrow changed to numbers. 3 in the menu and 2 for the back to the top. The Divi guys over at ET was telling me to add stuff to the .htaccess file and a few other things to try to fix this.
none of those options worked… but I did figure out what the problem was.
if you use the plugin DIVI POPUP MODAL MODULE
and add style2, it inserts a custom field box with the name:
sb_dbp_enqueue_style
and includes a link to:
/wp-content/plugins/divi_popup_builder/colorbox/example2/colorbox.css
if you disable the plug, this box will stay there and won’t be removed. creating a false positive that it is not the plugin causing this problem.
To fix this I just change 2 to 3 and the problem was resolved.
/wp-content/plugins/divi_popup_builder/colorbox/example3/colorbox.css
Overall this is an awesome plugin and well worth the cost!
Hello @Jai, @jeremy, @Jourdain, and everyone…
Sean thanks a million for your amazing plugins!
I’ve install this one and i’ve also wanted to show a Divi Layout as a popup, adding a padding around. This is the code i’ve paste into my CSS and it works:
#cboxLoadedContent {
width: auto!important;
overflow: auto!important;
height: 100%!important;
padding:5% 10% 5% 5%!important;
}
Cheers!
Hi there, this plug-in looks like it’s exactly what I need.
Will it work on a WordPress network (multi site) as well?
Any chance in getting a reply from the developer(s)?
Hi
Just bought the plugin and it is excellent. But, on one of my sites (the main one I want to use the plugin on) I’m using Extra and not Divi and everything is driven by categories and not pages. While the popup module appears in the list of modules available to put in a page it doesn’t appear in the list for a category. Is there any way it is possible to make it display using a category layout?
Hi there, is it possible to trigger the popup when scrolling down to a selected section?
Hi,
I’m missing the option to hide the module on desktop / tablet / mobile. Can this be added?
Cheers,
Jaap
Hi
Where can I see demo.
Will this be blocked if the visitor has enabled “Popup blocker”
Thanks
Sam
No it won’t be blocked because only popup windows can be blocked by systems like adblocker. Whereas this is a modal window/lightbox so it acts as part of the site 🙂
Hi,
I’m struggling with centering the button. When I keep it default it does center but when I add a border the border is full width. Giving the button a width works but then the button is aligned left. Giving it the et_pb_button class also makes it align left. Please help, this is driving me nuts 😉
Cheers,
Jaap
How can I set a maximum width for the popup and a dynamic height depending on the length of the text?
So on a smartphone it should be 80% width but not on a FullHD laptop…
Hi, this plugin was great to begin with; however, I have now come across an issue with the margin/padding within the popup. In short, the settings provided within the ‘Advanced Design Settings’ do nothing when it comes to adjusting margins or padding when using a Layout as the popup source. This causes my popup content to be squashed up against the edges of the popup, which looks terrible. Is this a known issue?
I built my wordpress website using a temporary URL provided by my webhost “http://216.172.168.11/~xtremeh0/”. After the site was completed I switched out the URL to “https://www.xtremegraphix.ink”. I am having 1 issue with the Divi Pop Up Builder. One of the .css files is holding onto the temporary URL.
If you go to the home page you can see this error in the console: “Mixed Content: The page at ‘https://www.xtremegraphix.ink/’ was loaded over HTTPS, but requested an insecure stylesheet ‘http://216.172.168.11/~xtremeh0/wp-content/plugins/divi_popup_builder/colorbox/example1/colorbox.css’. This request has been blocked; the content must be served over HTTPS.”
I have deactivated and reactivated the plugin and I have deleted and re uploaded the plugin. I have also contact bluehost and they were unable to resolve the issue. Do you have any ideas why this is happening?
Yep this is because the CSS file that is called is set by the module. Simply edit the page and resave it. It should then recalculate. If not then change the popup style, save, refresh twice and then change back. Silly I know but normally when moving a site you’d probably change the references to the old url in the DB
thanks
Sean
Thanks for the reply Sean. I have went in and refreshed the modal however it is still holding onto the url. Any ideas?
Hi I paid for your plugin twice, is there a way I can get one of the payment refunded?
Thanks
Yes, we don’t want you paying twice for the same thing – refund on its way 🙂
Thanks!
btw. This plugin is AWESOME
Will The pop up builder pop up a “contact form” modul?
I inserted a youtube iframe with the autoplay and its not working¿? why is this ?
can we not insert youtube iframes??
If you would kindly ask for support on this issue here http://docs.tortoise-it.co.uk/. I am sure the developer will be able to give you a definitive answer.
Hello,
I have the same question but I dont see any answers.
Is it posible to autoplay youtube videos?
If there are n o answers does that mean NO?
Hi,
I bought your module but I can’t see any new module called Divi Popup Builder in the modules’ list when I’m on the page builder…
I installed it, activated it and nothing.
If this doesn’t work, I surely want a refund.
Thank you
Please start a support ticket at http://docs.tortoise-it.co.uk/ – it will be there maybe under SB Module Popup.
Small thing. Can you move the admin label from “Custom CSS” tab to the bottom of “General Settings”, to match the Divi theme default. Went to look for that setting and it wasn’t where expected. This setting doesn’t really make sense under Custom “CSS” heading.
I agree. Just went to label today and saw this.
otherwise, great plugin
Hello, what I would like to know is if I can use the plugin to use the videos hosted on my pc, dropbox, one drive or drive, (files mp4).
At the moment I will not use videos hosted on youtube or vimeo. Greetings.
Hi,
It seems the plugin breaks the background image of the section. When I insert a modal button in a section which has a background image the image suddenly is presented very large.
Can this be fixed?
Cheers,
Jaap
Hello, I would like to know if you only reproduce the links of youtube and vimeo, or if I can reproduce other type of links. Greetings.
Hi Sue,
This isn’t the place to ask for support really hence the comments not being published. It’s mainly for pre-sales questions and the odd comment on how to achieve something. Support is provided at http://docs.tortoise-it.co.uk
thanks
Sean
Is there a way to achieve a image hover effect on the trigger images? This is all i need!
Yes there is a simple enough way. Make a module.. any module for the trigger. A image with the hover effect you want or something. Give it a class name. Then in my plugin just use the Class/ID trigger option and type in the class name for it to work. That should get what you want
Thanks for the quick reply. I think I might need a step-by-step instruction here. First of all, should the trigger module be on the same page as the modal-module?
I have created a code module and given it a class of “test”. The module shows the effect fine. I then create a modal module and set the trigger to class/ID and type in .test.
On the page nothing is displayed…. What am I missing?
Sean looking at buying but need to know, Will The pop up builder pop up a “contact form” modul?
Yes it will indeed, no problem.
Hi Sean, just purchased this plugin but don’t see an option to have the contact form as a source, can you explain the steps how this is possible?
Hi,
I designed a page and want that page to appear inside the popup, however the popup is stripping most of my CSS. Can you provide a workaround that so my page appears as I designed it?
Here’s how the page inside the popup should look: http://kushnermoving.com/dev/video-estimate-popup/
However, if you go here http://kushnermoving.com/dev/ and click the VIDEO ESTIMATE button you’ll see how the popup is messing up the design
Looking forward to your suggestions!
Never mind. Changing the Popup Source to iFrame solved my issue.
Hi Sue,
This isn’t the place to ask for support really. It’s mainly for pre-sales questions and the odd comment on how to achieve something. Support is provided at http://docs.tortoise-it.co.uk
As an answer to your question, it’s not normal for this to happen. Please get in touch via a support ticket and I’ll have a look for you.
thanks
Sean
Why no directions to the iFrame option? I am struggling to figure out how to include google map pop-up. Any suggestions?
Hey there. Documentation is improving but I agree there is none for this. I didn’t include it because I assumed people would know how to do it. The content option is best for a google map. Just use the Google embed code from google itself and paste that into the html/text view of the content editor in the popup module. This will show your map.
Alternatively you could use the layout option and use the Divi Google Map module with the popup.
S
The popup Module’s Custom CSS “Class” and “ID” fields don’t seem to be added even if they are filled out. Example: https://gyazo.com/1c296736e8b9adc9e649f16af58b5226
Those don’t appear anywhere within my code. Is this a known issue?
Hi there, the class and ID don’t show when the module is in Class/ID or page load format. Everything else should be ok. Note that the class and ID are on the trigger and not the modal itself.
S
Hello can i in the PopUp a html panorama file open
http://dinamedia.de/panos/demo/index.html
regards Dina
Yes I presume so as long as you use the iFrame option. It should work well.
Hi Andrew,
So far I’ve been able to figure out how to appropriately use this plugin.
I had used the contact layout that came with Divi and I couldn’t get the map to display in the pop up (so I just deleted the map, all is well).
But the padding is very squishy at the top of the pop up window. If I adjust in the advanced settings it adjusts the display of the main section and NOT the pop up.
There must be CSS or something to adjust this? Can you advise?
thanks so much
Hi,
I have placed a mp4 file on my server. In the popup-builder I am pointing to this file. But no luck.
Does it only work with youtube or vimeo or something like that?
I am trying to get a “clean” video without all kinds of (youtube) controls.
Rob
Yep the video option is designed for youtube etc but if you contact me directly I could see about testing with your MP4 file and making the solution work for you
Hi Sean
I’m also very interested in placing a mp4 video in the module. I hope it will be possible to do that soon.
/Maria
Hello,
I have used the Divi pop-builder in my website, It was working fine on Hostagator hosted website. But when I hosted website in windows server 2008, the pop-ups are all mixed up. I tried creating new pop-ups as well. But its still the same.
Strange is that, It is working fine on my server’s browser but on any other PC browser the when click on image it is showing mixed up pop-ups e.g details of image 1 is showing in all 3 images pop-ups.
Please let me know what is the issue.
I have updated the plugin to latest version and I am using this plugin in AC-Shortcodes and then put the shortcode in Image Carousel using plugin ET Slick Carousel Module
Hi,
The modal always pops under the DIVI main header/menu bar (and scrolls under it). Any way to force the modal over the menu?
Also anyway to prevent the parent browser page from scrolling when then modal is displayed?
Thx
You need to set the z-index to be a higher number (ex: 999999) on the lightbox in CSS. To prevent the form from scrolling with the background, you can also use CSS on the lightbox – set its position to fixed.
Hi,
What is the best way for the trigger button to gain the same appearance/behavior as the Divi Buttons in my theme? ie outline/font/animation etc.
Related: can I trigger the modal from a regular Divi button?
Thx
Using the class/id trigger option you can use any element from anywhere. The inbuilt triggers are basic and I’m working on styling options but the most flexible options are to use an external module and link using the class/id
S
Hi! I just bought the plugin, thanks! However, I’m having trouble making the popups use the selected style. I have one row with three buttons that launch popups and I want each button to show a different style. However, despite choosing style 1, style 2, and style 4, all three popups are showing style 4. How can I fix this?
Hi Sue,
I see what you mean. The plugin is designed to allow one per page I’m afraid. A limitation I’ll try and get sorted asap.
S
does this support multiple per page now?
Hi Andrew –
We’re noticing that the page jumps back up to the top when closing a pop up. Is there a way we can stop this from happening? Thanks in advance.
Hi Andrew-
I want to do something very simple: I have a text link “view contest rules” and I would like the rules to be in a popup – but I don’t see the option of selecting a text link – even though your sales copy says: “A trigger is what causes the popup to show. These can be as simple as a text link, image or button”
Can you tell me how I use a text link?
thanks!
Hi Julie,
No problem. There are a couple of ways to do it.. firstly the button trigger by default has no styling and therefore presents as a text link. If you need something inline then make a normal text link and give it a class (class=””) and then choose the class trigger for the popup.
thanks
Sean
Just got this plugin and I have a question. I want to show someone the four overlay style options when using the button + Content/Layout, however, despite selecting style1, 2, 3, and 4 for each button, they’re all displaying style1 overlays. Is this normal behavior or is there any CSS I can use to force the style I want on each button?
It takes a refresh to do it. On setting the style it defines the stylesheet to be used and does take exactly 1 page refresh to take effect.
Can modals be launched from Divi modules like from the button in call_to_action or the button in pricing_table?
thx-mike
Yes it can indeed. Using their class/Id you can launch from any element you like 🙂
Hi,
I would like to use or edit this module to make it into a custom post type so it becomes a filterable / searchable module.
Would this be possible in any kind of way?
Or to make the searching part for rows / columns possible?
Any help would be much appreciated, any if not possible..
Please contact me if custom development is needed, since we really need this functionality in any kind of form.
email = rico@webgerei.com
Thank you!
I just bought this plug-in. It is a great option, however I am having an issue with the pop-up video (on page load) being partially under the navigation/header. Is it possible to fix this. I am also using the divi layout injector just below the navigation. Not sure if this is causing an issue or not. I tried to add padding to the top but it didn’t seem to fix it. Would appreciate some help. https://endlessmountainsfilmfest.com/
Hi there,
Will this work with a shortcode inserted from something like Contact Form 7 / Gravity Forms to display a form in the pop-up?
Kind regards
Francois Wessels
If the shortcode is in a code module or text module yes it should do. You may have to play around with padding and margins though.
I am trying to get it to work with a Gravity Form right now. I’m all set except that when the “submit” button is clicked, the modal automatically closes. That means the user gets no confirmation that their message was sent. Even if they missed a field, the modal closes. There is some sort of close trigger built into the modal that’s overlapping with something on the submit button, and I haven’t figured it out yet.
Was there an answer to Lauren Perfors question. I am having the same issue as well.
Hi,
It’s a good module for Divi. But, I need to use it in a nav menu (I would like to launch a form to connect or register in a popup). I didn’t find how to do.
Thank you
Hi Gerald, with the pop up modal being a module, it would not be possible to use it for the menu items.
Could you hack the header and add a do_shortcode to call a module (like this: http://quiroz.co/add-divi-library-header-section-to-archive-pages/) that had the popup and then trigger it via class/ID from the menu?
How would you get this popup to trigger on posts and pages automatically?
You could just use Bloom actually. Good Tutorial here https://agirlandhermac.design/using-bloom-image-text-pop/
Is there any way to customise the button with round corners, an icon, a rollover effect etc? Currently the button looks really clunky against the other, customised divi buttons on the site.
You shoudl be able to customise the button like any other button as it is using the divi button – try going into the advanced mode of the button when you create it and adjusting the parameters.
Hi Andrew,
Can you explain this somewhat more? I don’t see a lot of options to style the button. For example to add an icon to it which shows when hovering. I also noticed the padding of the button disappears on mobile devices.
Cheers, Jaap
Hi, can you explain how to add an icon to the button when hovering? Just like the Divi button? The option is not there.
Just add a divi button module and style however you want then use the class/ID option in the popup accordingly
I’m having a problem with the text on buttons on mobile, the text on the button looks great on the computer but on smaller screens it overlaps it’s self. Making it unreadable.
If you go into the advanced settings and reset the mobile text to a reasonable size as there is a small bug in divi that set the mobile font to 51px
I don’t see an option for changing the mobile text size, there is a text size option for “Trigger Button Font Size” but it is set to 0, so I’m not sure what to change.
Did this get solved? I am having the same issue.
I am having trouble setting padding so the content doesn’t run up to the edges of the popup box. I’ve used Divi a ton, so I understand how to set padding and margins, but although everything looks good in the layout I’m creating for the popup, it hits the very edge of the popup box when triggered. Any suggestions?
The ‘businesses’ circular image is the only one I’ve done so far.
Thanks so much for your assistance. I’m still plugging away at this!
It depends on the type of content really. Layouts go up to the edge whereas the entered content leaves a gap I think. Also there are different styles which have different visual effects so do try those or contact me for support
S
Second issue, sorry. The button that the module creates looks great on the PC screen, but if I change the size of the browser window to simulate the responsive properties, the button text goes wild! Very large, and letters on top of themselves. Can this be controlled, or should I switch to an image trigger?
Go into advanced settings and reset the text to what ever size you want it. It may have defaulted to 51px which is a bug with divi and third party modules.
Thanks. It did default to 51px. After fixing that, it still did not look great when scaled down, so I opted for an image which I can control with more precision. Do you have any advice for the modal showing up below the header? Here is an example URL. Any help with z-index and placement on the page when scrolled down will be greatly appreciated. http://www.springibexpo.com/workshops. Click on the “About the Instructor” link to see the modal.
I added the following CSS which fixed the z-index. I think I’m good now. Thanks.
#colorbox { z-index: 99999; }
Hi, great plugin. I have a static header, with a centered logo, so it’s taller than default, and the top of the modal windows (70%) are going behind the header. Is there a place or a CSS class to set a higher z-index than the header in Divi? The modals are IFRAME and the trigger is a button. Thanks!
Hi, great plugin, thank you!
I have one problem with it though…
The slider module in Divi sets its size based on the slide with the most content. But when I use a Divi slider layout for the popup, the slides change in size as you click through them.
So for example, a slide with one line of text will be smaller than the next slide with 2 lines of text. This causes the slides to jump in an ugly manner as you move from one to the next.
Am I missing a setting? If not what can I do to fix this?
Hope you can help, many thanks,
Mark
Will this work with the Extra theme and Divi builder?
It was designed to work with the divi builder. Give it a try and if there are any issues – we’ll look at you kindly 🙂
Hello,
I have used the Divi pop-builder in my website, It was working fine on Hostagator hosted website. But when I hosted website in windows server 2008, the pop-ups are all mixed up. I tried creating new pop-ups as well. But its still the same.
Strange is that, It is working fine on my server’s browser but on any other PC browser the when click on image it is showing mixed up pop-ups e.g details of image 1 is showing in all 3 images pop-ups.
Please let me know what is the issue.
I have updated the plugin to latest version and I am using this plugin in AC-Shortcodes and then put the shortcode in Image Carousel using plugin ET Slick Carousel Module
Yep it should be fine. No problem at all
Hi, is there a way to autoplay the videos? I inserted a Youtube link with an autoplay parameter and it doesn’t work. Many thanks
I have the same question.
I need videos to autoplay but cant figure it out..
Please help.
Was this problem resolved? How? I am also having issues with autoplay.. such a simple thing
Hi Guys,
Have you tried the standard way of having auto play turned on by adding ?autoplay=1 to the end of your src link. eg…
src=”https://www.youtube.com/watch?v=cqg6RLeRs5Q?autoplay=1″
-Donal
Thanks.. No documentation yet although essentially you assign a class or ID to any element on the page. Either another module within the Divi builder or just add it to a normal text module trigger popup then add .clickme to the modal module. That’s all it needs 🙂
Wow!
Great stuff.
Thanx.
I like the trigger by class or ID.
Awesome.
But i can´t make it work….
Do i put just .clickme in the modal module´s main element css?
Just made it.
the trigger needs to be put in without the
.
before the class
(in my case “triggerpopup” as suggested)
Absouletly greta plugin.
Thanx Sean.
We’re sorry you are having issues with this plugin. In testing we managed to adjust the padding and margins on all tested modules including the video module – can we offer any advice or assistance. In the meantime – please see your inbox for a message from us 🙂
Hello @Jai, @jeremy, @Jourdain, and everyone…
Sean, Andrew! thanks a million for your amazing plugins!
I’ve install this one and i’ve also wanted to show a Divi Layout as a popup, adding a padding around. This is the code i’ve paste into my CSS and it works:
#cboxLoadedContent {
width: auto!important;
overflow: auto!important;
height: 100%!important;
padding:5% 10% 5% 5%!important;
}
Cheers!