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

Join today


Sign up for a Free membership and get access to this and all other free Divi layout packs, cheat sheets, exclusive discounts and much more.JOIN TODAY FOR FREE


  1. Henrik ThielenHenrik Thielen on July 14, 2019 at 5:14 pmthank you so much – very helpful tools and description.Reply
  2. LeineLeine on August 6, 2019 at 5:49 pmHi,I am using DIVI. Can I insert Google Captcha (reCAPTCHA) by using the plugins above?Reply
  3. LeineLeine on August 6, 2019 at 5:53 pmAnd if so. How can it be done?Reply
    • MarkMark on August 7, 2019 at 3:14 pmHi Leine,That is a good question but unfortunately I wouldn’t know. I might make a tutorial about it one day and see if it can be done.Reply
    • Divi PeopleDivi People on August 13, 2019 at 2:51 pmYou can google captcha with contact form 7 every easily. Check this doc:
  4. Jay JacksonJay Jackson on September 22, 2019 at 2:57 pmDoes exactly what I needed. You saved me a lot of time.Reply
  5. Juan BezuidenhoutJuan Bezuidenhout on October 3, 2019 at 12:53 pmThank you for the awesome tutorial 🙂Reply
  6. Abdul QadirAbdul Qadir on May 16, 2020 at 11:22 pmThis help me a lot, I am working on client website, and divi Contact form is not sending email i have spend whole day on but it does not, than i am thinking about contact form 7, but by default Contact form 7 is not look good in divi, your guide save my life,at the end of my comment you save my Life, Love you Sir..Reply
  7. Team DiviPeopleTeam DiviPeople on June 2, 2020 at 1:36 amHello Everyone!GOOD NEWS!We have an update Contact Form 7 Styler for Divi plugin, let us know what how it now. We added a new feature called Grid System, do you like it? If we added Contact Form 7 to Google Spreadsheet connector feature how it will be?See New Demo: