These changes require a Divi child theme. Please check the following article if you have not set a child theme yet: https://intercom.help/elegantthemes/faq-s-and-troubleshooting/how-to-make-a-child-theme
1. Next, create a new folder in the child theme folder , for example includes
folder.
2. Now copy the /includes/builder/module/ContactForm.php
file from the parent theme into the child-theme/includes/
folder.
3. Open up the ContactForm.php
file in the child theme and replace this line (at the very top):
class ET_Builder_Module_Contact_Form extends ET_Builder_Module_Type_WithSpamProtection
with
class Custom_ET_Builder_Module_Contact_Form extends ET_Builder_Module_Type_WithSpamProtection
Replace: $this->vb_support = 'on'; with $this->vb_support = 'off';
Remove this line from the bottom: new ET_Builder_Module_Contact_Form;
5. Finally, add the following code to the functions.php file in your child theme folder:
/*================================================
#Load custom Contact Form Module
================================================*/
function divi_custom_contact_form() {
get_template_part( '/includes/ContactForm' );
$dcfm = new Custom_ET_Builder_Module_Contact_Form();
remove_shortcode( 'et_pb_contact_form' );
add_shortcode( 'et_pb_contact_form', array( $dcfm, '_render' ) );
}
add_action( 'et_builder_ready', 'divi_custom_contact_form' );
function divi_custom_contact_form_class( $classlist ) {
// Contact Form Module 'classname' overwrite.
$classlist['et_pb_contact_form'] = array( 'classname' => 'Custom_ET_Builder_Module_Contact_Form',);
return $classlist;
}
add_filter( 'et_module_classes', 'divi_custom_contact_form_class' );
Now you are ready to customize the Contact Form module the way you need and keep the changes while updating/reinstalling the parent Divi theme.
You might want to add the following changes to your Contact Form module: