How to Make Contact Form 7 Look Like Divi

by | Apr 9, 2019 | Divi tutorials | 0 comments

How to Make Contact Form 7 Look Like Divi

If you want more freedom with your contact form then you can use the free contact form 7 plugin as your form builder. Contact form 7 will give you more field options, for example, a date field.

However, the contact form 7 styling is very basic, but fortunately, there is a great free Divi plugin that you can use for styling contact form 7 forms. With this free plugin Contact Form 7 Styler for Divi you can style any contact 7 form in the visual builder for Divi.

In this tutorial, I will show you how you can make contact form 7 look like Divi or give it any look you want.

Step 1: Install contact form 7 and Contact Form 7 Styler for Divi

In your dashboard navigate to Plugins > Add New

Search for contact form 7 by Takayuki Miyoshi and install the plugin.

Then search for Contact Form 7 Styler for Divi by DiviPeople and install it.

Contact form 7 styler for Divi

Step 2: Create your form in contact form 7

Go to Contact > Add New and create a form in that you want to use as your form. In this example, I created a reservation form for my restaurant child theme.

Form created in contact form 7

Step 3: Style your form

Go to the page you want to show your form, you can do this from the backend or the frontend with the visual builder.

Insert a new module and you will find here a new module type called Contact Form 7 Styler.

Contact form 7 styler module

Under General choose the form that you have created in step 2. With these modules you can style your contact 7 form just as the Divi form module.

This is my end result:

Reservation form


Submit a Comment

Your email address will not be published. Required fields are marked *