Try Amazon Prime Video for FREE for One Month. Click for details.

Customize / Change Submit Button Text in Contact Form

By Divi Dude

Nothing in life is easy. Although, often times Divi seems to be the exception to the rule. Well, not when trying to change the text of the submit button in the contact form module. Don’t get me wrong, it is easy to do, just not to figure out how to do. You see, there is no place within Divi to customize it. Not in the Contact Form module; nor in the Module Customizer > Contact Form. To change it, you have to mess with javascript. Yikes.

Wait, this page is supposed to show you how to do it, not scare you away. Sorry, sometimes I forget my role. It’s actually quite simple. Here’s a tutorial I did that shows how … or you can find step-by-step instructions below the video. Whichever is easier for you to follow.

Change Divi’s Submit Button Instructions

Step 1: Log into your Divi theme, go to the page with your contact module and open up the module so you see the picture below.

Divi Tutorial Change Submit Button

Step 2: Click on the Custom CSS tab and in the CSS Class field enter a custom name. For the purpose of this tutorial in the video above I entered: customContactButton.

Step 3: Save module and update page.

Step 4: Go to the Divi Theme Options in the righthand menu and click on the Integration tab.

Step 5: Enter the following code in the “Add code to the HEAD of your blog” field. (see picture below).

<script type= "text/javascript">
jQuery( document ).ready(function() {
jQuery('.CUSTOM_CLASS_NAME_HERE .et_pb_contact_submit').text('CUSTOM_TEXT_HERE');
});
</script>
Divi 3 Tutorial Customize Submit Button

Step 6: Replace CUSTOM_CLASS_NAME_HERE with what you entered in Step 2. For the purpose of the video above, I entered .customContactButton (be sure to include the dot here; but not in step 2).

Step 7: Replace CUSTOM_TEXT_HERE with whatever you want the button to say. This will replace the “Submit” word. So enter ‘Send’ or ‘Mail’ or whatever you want. For the purpose of the video above, I entered ‘Mail Me’.

Step 8: Save changes.

Step 9: Go to your page with the contact module and see the change (you may need to refresh).

Better Social Media




Must Have Plugins

WP Theme FAQs

WP Rocket - WordPress Caching Plugin

Duplicator Pro: WordPress Backups Made Simple

Faster WordPress Hosting

Load WordPress Sites in as fast as 37ms!

Affordable Domain Registration

Get $1.00 off.
DiviDudeWeb16

Popular Domains for just 99 Cents at Namecheap!

Legal Disclaimer

To support the publication of this website, this site runs banner ads and is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to amazon.com. As an Amazon Associate I earn from qualifying purchases. Also other ads may result in commission payments or other compensation.

Favorite WordPress Theme

Divi WordPress Theme

Start Your Newsletter

MailerLite Email Marketing for Small Business

 

Constant Contact

For Your Inner Nerd

Rolecosplay Movie Costumes

More From Divi Dude

Delete Spam Comments in Bulk Without Plugin on Cloudways

Delete Spam Comments in Bulk Without Plugin on Cloudways

Sometimes you screw up and forget to turn off comments on your WordPress website, or forget to configure your Askimet, or do both, and then you end up with thousands of comments that are nothing but spam. We’re talking hundreds of pages worth of comments that need to…

MailerLite is an affordable, easy-to-use newsletter and email marketing platform

MailerLite is an affordable, easy-to-use newsletter and email marketing platform

For the longest time I used MailChimp. I was drawn to the 2,000 free subscribers.

But when MailChimp changed how they defined subscribers and made some other not so user friendly changes, I started looking for alternatives. Not just for the free tier, but for my paid subscriber lists (I have clients that send out newsletters and they need more bang for the buck than what many free tier offers).

Delete Spam Comments in Bulk Without Plugin on Cloudways

Delete Spam Comments in Bulk Without Plugin on Cloudways

Sometimes you screw up and forget to turn off comments on your WordPress website, or forget to configure your Askimet, or do both, and then you end up with thousands of comments that are nothing but spam. We’re talking hundreds of pages worth of comments that need to…

Join Our Awesome List

Join our mailing list to receive the latest news and updates from Divi Dude. We don't write often, but when we do, everything will more or less be spelled correctly (oh, and be interesting and fun and knowledge based).

Thanks Dude! You've successfully subscribed.

Pin It on Pinterest

Share This