I'm using Contact Form 7 plugin in a WordPress template. I created the form and the related CSS, so everything is working fine. I need to do the following, when I click the send button and I have a successful sent email. the form should disappear and shows "Sent!" instead of that. I need to know the code that I need to change. Please see the photo that shows what I like to do
Soltution to hide the success message Next, edit form you want to change and go to bottom of it. You will get box named as “Additional Settings”. In the “ Additional Settings ” box, add following line of code. Thats it.
There are 2 general ways to show a message after submitting an HTML form: Use Javascript AJAX to submit the form and show a message when the processing is complete. Submit the form as usual, and have the server-side script pass back a flag to show the message. Just how exactly does each of these work?
Go to Dashboard > Plugins > Installing plugins, find Contact Form 7 in the list y click on Deactivate. Best regards, Yordan.
If you set demo_mode: on in the Additional Settings field, the contact form will be in the demo mode. In this mode, the contact form will skip the process of sending mail and just display “completed successfully” as a response message.
"on_sent_ok:" and "on_submit" are removed from Contact Form 7 5.0 so need to use one of the 2 available options.
To hide the form, need to add the event listener either in your js file or can add as action in footer using the script mentioned:
add_action( 'wp_footer', 'contact_form_sent' );
function contact_form_sent() {
?>
<script type="text/javascript">
document.addEventListener( 'wpcf7mailsent', function( event ) {
if ( 'FORM_ID' == event.detail.contactFormId ) { //Use this only when targeting specific form.
document.getElementById('DIV_ID_OF_FORM').style.display = 'none';
} //Use this only when targeting specific form.
}, false );
</script>
<?php
}
If you want to hide the form and display the thank you message, you can use the CSS below.
.wpcf7-form.sent p
{
display:none;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With