All CollectionsDivi Multistep Contact FormCustomizing Buttons on Divi Multistep Contact Form

Customizing Buttons on Divi Multistep Contact Form

Alex Brinkman

The Divi Multistep Contact Form plugin was built to be highly customizable to match any theme or layout.

One important way to achieve this seamless look with your website is to customize the ‘next’ and ‘back’ buttons users see as they navigate through the steps of your form. This can be done right in the Divi Builder using the built in controls, here’s how.

Enable the custom buttons

To enable custom buttons, open your Divi Contact Form module, click the Design tab and open the Buttons toggle.

Divi multistep contact form Design > button options

Note: these toggles will only be available if you’ve enabled the Multistep Features for the module, which can be found in the Content tab under the Elements toggle. See this article on enabling the Multistep Features for more information.

Inside the Buttons toggle, you will see 3 toggles:

  • Use Custom Styles For Button. Controls the styling for the submit button.
  • Enable Custom Styles for Multistep ‘Back’ Button. Enables controls to style the button used for the ‘back’ button.
  • Enable Custom Styles for Multistep ‘Next’ Button. Enables controls to style the button used for the ‘next’ button.
Divi multistep contact form custom button toggles

Enabling the custom styles for either the ‘Back’ or ‘Next’ button will display additional controls you can use to adjust the styling of the button to match your theme or layout, including:

  • background color
  • border color
  • border radius
  • border width
  • font weight
  • text color
  • text size

Having control over both the ‘Back’ and ‘Next’ buttons separately allows you to be creative in your design to really make your form stand out.

Be sure to clear any caches after changes

Because this plugin extends an existing, native Divi module, it’s recommended you clear any caching plugins active on the website (and your browser cache for good measure) after making any changes.

If your website is still in active development prior to launching, it’s considered best practice to leave all caching plugins disabled while working on the website to avoid any caching conflicts.

  • Did this answer your question?
  • Yep!No