If you’re tired of dull, boring FAQs on your website, it’s time to try something new. With Divi Supreme FAQ module, you can create stunning FAQs that are both informative and visually appealing. There are many styling and content options available, so you can customize your FAQs to match your website’s look and feel. Content Options Adding FAQ Items Click on + Add new Item to add your first FAQ Item . Clicking + Add new Item will open a completely new list of design settings (including Content, Design, Advanced) for your new FAQ Item. See below for individual FAQ Item settings. After you add your first FAQ Item, you will see a gray bar FAQ Item near with the title of your FAQ shown as a label. The gray bar also has three buttons that allow you to edit, duplicate, or delete the FAQ Item. General Gap Here you can add a gap between your FAQ Items! Make Accordion Enable this option If you'd like to make the FAQs Accordion, with this only one item can be opened at a time, other items will be closed automatically. Open First Item Enable this option, If you'd like to have the First Item opened by default. Enable Schema Support If you'd like to show your FAQs in Google (& Others) Search Results, then enable this option. Use Image If you'd like to use the same Image in the Toggles for all FAQ items, then you can enable this option. A new Panel will appear, where you can add your Image for both states. See In Item settings, If you'd like to have a different image for each item. Animate Toggle Icons Enable this option If you'd like to animate the Toggle Icon when you open/close a Toggle. Toggle Icon Open FAQ Icon Select Icon for the FAQ for Open State here. Close FAQ Icon Select Icon for the FAQ for Close State here. Icon Placement Here you can change the placement of the Icon, If you place it right, It will move the Image to Left (If used) and Icon to right. Toggle Image This Panel will only appear If the "Use Image" option is enabled in the "General" Settings. Open Image Select Image for the FAQ for Open State here. Close Image Select Image for the FAQ for Close State here. Design Options Open State Title Here you can customize the Open State Title font, size, color and weight etc. Close State Title Here you can customize the Close State Title font, size, color and weight etc. Toggle Open State Open Background Color Here you can change the Background Color of the FAQ/Toggle Item - For Open State. Margin Add Margin to FAQ/Toggle Items here If you wish - For Open State. Padding Add Margin to FAQ/Toggle Items here If you wish - For Open State. Else you can customize the Toggle Open State by adding Border, Border Radius & Box Shadow etc. Toggle Close State Close Background Color Here you can change the Background Color of the FAQ/Toggle Item - For Close State. Margin Add Margin to FAQ/Toggle Items here If you wish - For Close State. Padding Add Margin to FAQ/Toggle Items here If you wish - For Close State. Else you can customize the Toggle Close State by adding Border, Border Radius & Box Shadow etc. Image Open State Width Here you can change the Width of the Image- For Open State. Margin Add Margin to the Image here If you wish - For Open State. Padding Add Margin to the Image here If you wish - For Open State. Else you can customize the Image Open State by adding Border, Border Radius & Box Shadow etc. Image Close State Width Here you can change the Width of the Image - For Closed State. Margin Add Margin to the Image here If you wish - For Closed State. Padding Add Margin to the Image here If you wish - For Closed State. Else you can customize the Image Closed State by adding Border, Border Radius & Box Shadow etc. Icon Open State Open Icon BG Color Change the Background Color of the Icon here - For Open State. Open Icon Color Change the Color of the Icon here - For Open State. Margin Add Margin to the Icon here If you wish - For Open State. Padding Add Margin to the Padding here If you wish - For Open State. Open Icon Font Size Change the Icon Font Size here - For Open State. Else you can customize the Icon Open State by adding Border, Border Radius & Box Shadow etc. Icon Close State Close Icon BG Color Change the Background Color of the Icon here - For Close State. Close Icon Color Change the Color of the Icon here - For Close State. Margin Add Margin to the Icon here If you wish - For Close State. Padding Add Margin to the Padding here If you wish - For Close State. Close Icon Font Size Change the Icon Font Size here - For Close State. Else you can customize the Icon Close State by adding Border, Border Radius & Box Shadow etc. Content This is where you can customize the Content Description by changing its font, size, color and weight etc. Advanced Options Use the advanced options to give your Supreme FAQ module custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module's visibility on certain devices. Supreme FAQ Item Content Options General Title Here you can Add Title for your FAQ Item. Content Here you can Add Content for your FAQ Item. Use Image If you'd like to use Image in the Toggle for this particular item, then you can enable this option. A new Panel will appear, where you can add your Image for both states. Toggle Icon Open FAQ Icon Select Icon for the FAQ for Open State here. Close FAQ Icon Select Icon for the FAQ for Close State here. Toggle Image This Panel will only appear If the "Use Image" option is enabled in the "General" Settings. Open Image Select Image for the FAQ for Open State here. Close Image Select Image for the FAQ for Close State here. Supreme FAQ Item Design Options Below Styling Options will only apply to this Particular Item and won't be applied to other Items, to have the same styling for all FAQ Items, use Design Options in the Main Settings. Open State Title Here you can customize the Open State Title font, size, color and weight etc. Close State Title Here you can customize the Close State Title font, size, color and weight etc. Toggle Open State Open Background Color Here you can change the Background Color of the FAQ/Toggle Item - For Open State. Margin Add Margin to FAQ/Toggle Items here If you wish - For Open State. Padding Add Margin to FAQ/Toggle Items here If you wish - For Open State. Else you can customize the Toggle Open State by adding Border, Border Radius & Box Shadow etc. Toggle Close State Close Background Color Here you can change the Background Color of the FAQ/Toggle Item - For Close State. Margin Add Margin to FAQ/Toggle Items here If you wish - For Close State. Padding Add Margin to FAQ/Toggle Items here If you wish - For Close State. Else you can customize the Toggle Close State by adding Border, Border Radius & Box Shadow etc. Image Open State Width Here you can change the Width of the Image- For Open State. Margin Add Margin to the Image here If you wish - For Open State. Padding Add Margin to the Image here If you wish - For Open State. Else you can customize the Image Open State by adding Border, Border Radius & Box Shadow etc. Image Close State Width Here you can change the Width of the Image - For Closed State. Margin Add Margin to the Image here If you wish - For Closed State. Padding Add Margin to the Image here If you wish - For Closed State. Else you can customize the Image Closed State by adding Border, Border Radius & Box Shadow etc. Icon Open State Open Icon BG Color Change the Background Color of the Icon here - For Open State. Open Icon Color Change the Color of the Icon here - For Open State. Margin Add Margin to the Icon here If you wish - For Open State. Padding Add Margin to the Padding here If you wish - For Open State. Open Icon Font Size Change the Icon Font Size here - For Open State. Else you can customize the Icon Open State by adding Border, Border Radius & Box Shadow etc. Icon Close State Close Icon BG Color Change the Background Color of the Icon here - For Close State. Close Icon Color Change the Color of the Icon here - For Close State. Margin Add Margin to the Icon here If you wish - For Close State. Padding Add Margin to the Padding here If you wish - For Close State. Close Icon Font Size Change the Icon Font Size here - For Close State. Else you can customize the Icon Close State by adding Border, Border Radius & Box Shadow etc. Content This is where you can customize the Content Description by changing its font, size, color and weight etc. Timeline Item Advanced Options Use the advanced options to give your FAQ Item custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module’s visibility on certain devices.

Divi Supreme's Popup extension opens a whole new world for Creating Popups in Divi. It makes it really easy while creating Popups of anykind. It's a whole new solution that works really nice with Divi. This extension will extend the Visibility Option in all the Module setting that will allow you to use the Popup. Currently, the available supported modules are listed below: All Divi Default Modules All Divi Supreme Pro Modules(Pro Version). Before Using Divi Popups: Before you start using the whole new solution of Popups make sure that It’s Enabled from the Plugin Settings. Go to Divi Supreme Pro > Enable Supreme Popup and the Click on the Save Changes Button. Usage To use Divi Popups Extension, go to any of the supported module’s (listed above) settings and navigate to the Advanced Tab Scroll to Visibility and look for Use Popup Switch. Use Popup This will enable or disable the Popup extension. Popup Type: This is where you can choose the Popup type. Layout : You can choose this option to select a layout from Library to be shown in Popup. iFrame : Using this Popup type you can load a web URL in the Popup. Image : You can use this to show an image in the popup. You’ll be prompted to upload an image or select from Media Library.. Video : Using this Popup type you can show a video in the Popup just enter the URL of the video and you’re good to go.. Popup (Divi Library): This is an interesting part where you can choose any Layout from your Library to show in Popup. Trigger On: This is where you can choose how to trigger the Popup. Module Click : The Popup will be triggered when the whole module is clicked. Button Click : If the module is Button the popup will only be triggered when exactly the button is clicked. Image Click: If the module is an Image the popup will only be triggered when exactly the image is clicked. Hyperlink Click : If there is any link in your text module then selecting the Hyperlink method will show the Popup when the link is clicked. By ID : Select this Trigger Type to open the Popup from any element click If It has that ID. By Class : Select this Trigger Type to open the Popup from any element click If It has that Class. Page Load : If selected the Popup will be shown on Page Load —– Timed Delay : Set the Duration for the Popup to show. —– Cookie Expiry : Set the Expiry in days after then the Popup will be shown again. —– Use Custom Cookie Expiry Date : Set your own Custom Expiry for the cookie. Scroll : If selected the Popup will be shown only then when you’ll scroll to that module. —– Timed Delay : Set the Duration for the Popup to show. —– Cookie Expiry : Set the Expiry in days after then the Popup will be shown again. —– Use Custom Cookie Expiry Date : Set your own Custom Expiry for the cookie. Exit Intent : If selected the Popup will be shown when you’re about to leave the Browser Tab. Close Popup Triggers: This is where you can choose the way your popup should be closed. Outside Popup : The Popup will close after clicking anywhere outside of the popup. Close Button : A button will be shown to close the popup you can change the icon of the button and play with colors as well. Use Auto Close Popup: Enabling this option will let you close your popup after time you’ll enter in the field. After Time Passed (in s) : A button will be shown to close the popup you can change the icon of the button and play with colors as well. * Entrance Animation In: This is where you can choose the Entrance Animation of your Popup from 43+ Different Animations. Exit Animation In: This is where you can choose the Exit Animation of your Popup from 43+ Different Animations. Popup Position: This is where you can choose where on the screen the popup will show. There are 9 places you can select from: Top Left Top Center Top Right Center Left Center Center Right Bottom Left Bottom Center Bottom Right Popup Position Type: Absolute: If selected the popup will be shown as simple content on page it will scroll with page scroll. Fixed: If selected the popup will be fixed on screen it will stay on front even on page scroll. Very great for Cookie Notice. Use Fullwidth: Here you can enable this option to make the popup content to be shown on full screen. Popup Max Width: Here you can enable this option to make the popup content to be shown on full screen. Show Overlay: You can choose this option whether you want to use the background overlay or not Overlay Background Color: Here you can change the width of the slider. Show Close Button: Using this Switch you can Show or Hide the Close button to Close the Popup. Close Button Placement: Here you can change the Placement of the Close Button Inside or Outside. Inside : This will show the Close Button inside of the Popup. Outside : This will show the Close Button outside of the Popup. Close Icon Font Size: Here you can change the size of the close button. Close Button Icon: You can change the Icon of the Close button to your Desired one from the Whole Divi Icon Library. Close Button Background Color: Here you can change the Background Color of the Close Button Icon. Close Button Icon Color: Here you can change the Color of the Close Button Icon. Some Tutorial/Helpful Links for you to get started with Divi Popup Extension: How to create Popups using Divi Popup Extension - Complete look at all the Features How to Create Beautiful Popup with Divi Supreme - A simple popup + Free Layout 10 Beautiful Popup Layouts to Get Started with Our Popup Extension How to Open Popup from Menu Item Click So we've been getting a lot of requests on this from Customers to open the Popup from the Menu Item. So Finally, there's a way to Open It from any Menu Item you wish. Step 1: Go to Divi -> Theme Builder -> Edit Global Footer and here add an empty Text Module. Step 2 : Then Set up your Popup in this Module the way you wish. And make sure to change the Trigger type to "By Class" and then enter the class "open-popup" (You can add any class here). Step 3 : Now go to Appearance -> Menus and here click the "Screen Option" at the top and check the "CSS Classes" option. Step 4 : Now add that class to any Menu Item you wish to Open the Popup from. Video Walkthrough:

Divi Supreme - Divi Supreme - FAQs and Documentation

Divi Typing Effect Module

Divi Supreme Circle Info Module

Divi Supreme Filterable Gallery Module

Divi SVG Animation Module

Supreme FAQ Module

Divi Supreme Pro License

Supreme Progress Bar Module

Divi Social Share Buttons Module

Divi Supreme Advanced Tabs Module

Divi Popup Extension