Overview & Getting Started

Welcome to the documentation for Grid & Styler For Contact Form 7 And Divi. This plugin provides an intuitive 4-column drag-and-drop grid layout builder for Contact Form 7 along with a dedicated Divi Styler module to design form elements visually.

Pre-Requisites

• A WordPress Website
• Divi Theme or Divi Builder
• Contact Form 7 Plugin
• Grid & Styler For Contact Form 7 And Divi Plugin

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

WordPress Setup

1. Log in to your WordPress Admin Dashboard.
2. Ensure Divi Theme / Divi Builder and Contact Form 7 are installed and active.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Install “Grid & Styler For Contact Form 7 And Divi”

1. Navigate to Plugins > Add New in your WordPress Admin.
2. Click Upload Plugin at the top of the page.
3. Select the downloaded grid-styler-for-contact-form-7-and-divi.zip plugin file.
4. Click Install Now, then click Activate Plugin.
5. Enter your license key when prompted to activate your license and enable automatic updates.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Creating Multi-Column Grid Layouts & Styling in Divi

1. Open Contact > Contact Forms in WordPress Admin to build multi-column grid layouts using the visual 4-column grid drag-and-drop editor.
2. Open any page in the Divi Visual Builder.
3. Add the CF7 Styler Divi module.
4. Select your Contact Form 7 form from the dropdown.
5. Customize fonts, input borders, button hover states, padding, and validation message colors visually.