Popups for Divi vs Divi Gravity Forms (WP Tools)

After the plugin is activated, the Visual Builder displays a new tab called “Popup” in the Section Settings modal. In the “Popup” tab, you can turn a regular Section into a Popup! It’s super simple, as you can see on the plugins Demo Page: divimode.com/divi-popup/demo ℹ️ How it works First, activate the plugin (no configuration needed!) Open up your Visual Builder and edit a Section – you’ll see a new “Popup” tab in the Section Settings. Toggle the option “This is a Popup” and set the “Popup ID” to something (e.g., “newsletter-optin“). Close the Section Settings. Add a Button Module somewhere else on the page and set the “Link URL” to your Popup ID, with a leading “#” hash (e.g. “#newsletter-optin“) That’s all. Save the page and exit the Visual Builder! Click on the button, and you’ll see your Popup. Congratulations! ⭐️ Additional details Check out the Plugin website for more details. You’ll find: Examples CSS class options JS API documentation WP filter documentation Tested in all major browsers on Windows and Mac: Chrome, Firefox, Safari, IE 11, Edge! Popups for Divi Course During the past years, we’ve added a ton of features and have created a stable and powerful marketing plugin. To celebrate the anniversary, we have created a six-day course that teaches you everything about the plugin. It walks you through the basics of creating your first Popup, shows possible ways to customize your Popup layouts and goes into advanced techniques and usages of the plugin. “The instruction emails really helped me to understand how to use the plugin correctly!” The course is available in your wp-admin Dashboard right after you install and activate the plugin. Check out the screenshots to see the form. Also, have a look in the FAQ section, if you want to disable this feature. 🥳 Want more? If you want to get the most out of Divi, you need to have a look at Divi Areas Pro to get additional features: An admin UI to create and configure your popups Choose between 4 Area Types: Popup, Inline, Fly-in, Hover A beautiful UI that blends in perfectly with Divi Add advanced triggers to your Areas: On click On hover On scroll After delay On Exit Customize the Area Display Show on certain pages Show on certain devices Show for certain user roles or guests Customize Area Behavior Show/Hide the Close button Display the Area once per hour, day, week, … Flexible position for Inline Areas Replace/extend the page header or Footer or Comment section or actually any Divi section inside the page content It comes with an extended version of the JS API Great documentation built into the plugin and an online knowledge base and much more… 👉 Learn more about Divi Areas Pro (with screenshots!)

Embed gravity forms in Divi visual builder. Add styles for gravity forms border, background, title, description, inputs, labels, placeholder, errors, submit button & more. Premium version has 7-day FREE trial. No upfront payments needed. It has dependencies on the following, Divi Theme – Affiliate link Gravity Form – Affiliate link With the FREE plugin you can, * Add a gravityform on a divi page using the visual builder. * Configure the gravityform shortcode params Gravityform Shortcode Parameters Show Title – Toggle to display the form title. Defaults is on Show Description – Toggle to display the form description. Defaults is on Ajax – Toggle to use AJAX to submit the form. Defaults is off Tab Index – Specify the starting tab index for the fields of this form Field Values – Specify the default field values. Example: field_values=’check=First Choice,Second Choice’. See also https://docs.gravityforms.com/using-dynamic-population/ for detailed information on dynamic population. Premium Plugin Premium plugin is available at https://wptools.app/wordpress-plugin/gravity-forms-divi-module/ We offer a 7-day FREE trial on the premium plugin. Style Form Background, Spacing & Border Set color, gradient, image or video backgrounds. Add border, margin & padding to form wrapper. Style Gravity Form Title Style the title typography and spacing using the divi module Style Gravity Form Description To render gravityform description, toggle the Show Description to on in Gravityform Shortcode Parameters. Style the description typography and spacing using the divi module Style Gravity Form Section Break Field Section break field adds a content separator to your gravity form – https://docs.gravityforms.com/section-break/ Style the content’s title, description, spacing and border color using the divi module. Style Input Fields, Input Wrapper & Input Placeholder Input fields are text, textarea, checkbox and radio fields. Input Wrapper wraps an input field. Manage input wrappers margin and padding. Add background, border and rounded corners for text, textarea and dropdown fields. Manage typography for input fields in the Input General section. Manage checkbox and radio typography settings in Checkbox/Radio section. Manage margin and padding for text fields. Manage typography for input placeholder text. Style Label, Sub-Label & Input Field Description Style gravityform’s label, sub-label and description for the inputs. Set typography and spacing for them. Style Field Wrapper A field wrapper wraps the input field, label, sub-label and description. Manage the field wrappers padding and margin in divi. Style Form & Field Validation Errors Form Validation Error is a general validation error text for the whole form. Manage typography, border color, margin and padding. Field Validation Error shows the validation per field. Manage typography, border color, background color, margin & padding. Style Forms Submission Confirmation Message Form submission displays a message. Style typography & background of the confirmation message. Style Gravityform Button Set button alignment, typography, border, rounded corner and background color with hover styles. Style Consent Field & Description A gravityform consent field is a checkbox accompanied by description. It’s a compulsory field. Style the checkbox’s and description’s typography, margin & padding Style Gravityform Footer Footer wraps the form buttons. Manage margin and padding for this element. Style Progress Bar A multi-step gravityform has a progressbar at the top. Style the progressbar title’s typography, progressbar’s background and font color. Custom CSS Setting A fine-grained control over writing custom css for large number of form elements