In this post, we'll guide you through the process of adding HTML content – specifically links – to the success message in Divi's contact form module. This can be useful for directing your users to important resources or additional information right after they've submitted the form.
Sometimes, the standard "Thanks for contacting us" message isn't enough. You might want to provide users with additional links, such as to documentation, FAQs, or scheduling a follow-up. Here's how you can enhance your Divi contact form's success message with HTML links.
Enabling HTML in the Divi Contact Form Success Message Using PHP
The following code will enable HTML entered into the success message field to be rendered as HTML on the page:
function db_contact_form_success_message_allow_html( $output, $render_slug, $module ) {
if ( 'et_pb_contact_form' === $render_slug ) {
$pattern = '#<div class="et-pb-contact-message"><p>([^<]*?)</p></div>#';
$output = preg_replace_callback($pattern, function($matches) {
$decoded_message = html_entity_decode( $matches[1] );
return '<div class="et-pb-contact-message"><p>' . $decoded_message . '</p></div>';
}, $output);
}
return $output;
}
add_filter( 'et_pb_contact_form_shortcode_output', 'db_contact_form_success_message_allow_html', 10, 3 );Related Post: Adding PHP to the Divi Theme
functions.php file of your child theme or use a plugin like Code Snippets to manage your custom code safely.Modifying the Success Message Directly in Divi
After adding the code, you can include HTML directly in the success message via the Divi builder.
- Go to your contact form settings: Contact Form Settings > Content > Text > Success Message.
- Enter your custom message with HTML links like so:
Thanks for contacting us! For more details, <a href="https://example.com">click here</a>.
You might want to include various types of links in your success message, such as resource links, support links, or next-step links. These can help guide your users to important information or actions they might need to take next.
Enhancing your Divi contact form success message with HTML links is a straightforward process that can greatly benefit your user interactions. By following the steps outlined above, you can provide additional value and resources to your users directly from the success message.
0 Comments