Redirect to a Thank You Page with WordPress Contact Form 7

Contact Form Seven is a great plugin, but it is missing one essential feature when it comes to tracking conversions. That is redirecting to a thank you page on form submit.

This tutorial will explain how to redirect to a Thank You Page with WordPress Contact Form 7

Solution #3 (Best Answer):

Option 1: Global Thank you Page Redirect (all forms)

If you want to redirect all pages to the same thank you page just copy and paste the code below into your themes functions.php file.

Code:

//This function prints the JavaScript to the footer
function add_this_script_footer(){ ?>

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'http://yourdomain.com/thank-you';
}, false );
</script>

<?php }

add_action('wp_footer', 'add_this_script_footer');

Obviously, you need to replace the http://yourdomain.com/thank-you in the code to the URL you want to redirect to.

Option 2: Multiple Thank you Page Redirects (individual forms/pages)

Okay, so Option 1 works if you want to redirect all Contact Form 7 forms to the same thank you page, but what if you just want a single form like the one on your contact page to redirect? Or maybe you want multiple forms to redirect to different thank you pages.

Fix A: Use this plugin
https://wordpress.org/plugins/contact-form-7-success-page-redirects/

I have tested this plugin and it seems to work well. It’s using the “wpcf7_mail_sent” action hook to fire the redirect. Hopefully this hook is not deprecated any time soon by the Contact Form 7 author because this plugin seems to be the best redirect solution.

Fix B: Add this code

If you don’t want to depend on some unknown authors buggy plugin (see support forum) you could just pop the code below in your footer.php or a page template file for any given page the form is on. I placed the code just after the wp_footer(); function in my themes footer.php file.

Code:

<?php
//Redirect to Thank you Page if page name is "contact"
if ( is_page('contact')) {
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'http://example.com/thank-you';
}, false );
</script>
<?php } ?>

Again, you need to replace the http://yourdomain.com/thank-you URL and the “contact” page name in the code.

Solution #1 (Deprecated): Simply put this code in the “Additional Settings” area of the Contact form 7 Admin:

on_sent_ok: "location = 'http://www.yourdomain.com/thank-you/';"

Solution #1 was the recommended solution until recently for Redirecting to a Thank You Page, but the Contact Form 7 developer has stated that the method of using on_sent_ok hook is no longer recommended. Don’t ask me why he would do such a thing, but the function is scheduled to be abolished by the end of 2017.

See: https://contactform7.com/redirecting-to-another-url-after-submissions/

Solution #2 (Old hacky solution):

Step #1: First thing is to create a Thank You page in your WordPress admin. Name it “Thank You” with a permalink of “thank-you”.

Step #2: Go to your WordPress root directory and open up the script.js. (should be /wp-content/plugins/contact-form-7/script.js)

Step #3: In the scripts.js search for: if (1 == data.mailSent)

then add the following code after the jquery code: location.href=”http://www.yourdomain.com/thankyou/”;

so the final code will look something like this:

if (1 == data.mailSent) {
                  $(data.into).find('form').resetForm().clearForm();
                  location.href="http://www.yourdomain.com/thank-you/";
                  ro.addClass('wpcf7-mail-sent-ok');

or this depending on the Contact 7 version you are using:

if (1 == data.mailSent) {
                  jQuery(data.into).find('form').resetForm().clearForm();
                  location.href="http://www.yourdomain.com/thank-you/";
                  wpcf7ResponseOutput.addClass('wpcf7-mail-sent-ok');

Obviously you will have to change the http://www.yourdomain.com to the url of your website.

Save the file on your server and you’re done.

Solution #3 used to work, but the code has changed a lot and probably won’t apply to your version of Contact Form 7.

Let me know if you have any questions.

Shawn

Share Web Design

66 Comments

  • andrew

    I can’t figure this out for the life of me. I understanding coding “somewhat” well, but for some darn reason, this just doesn’t want to work.

    I’ve tried Solution #1, but no luck.

    And I’ve tried Solution #2, but can not locate the exact location of /wp-content/plugins/contact-form-7/script.js in the Contact Form Editor.

    Thoughts????? Please help!

    • Shawn Hayes

      Hi Andrew,
      I am sorry you are having trouble. If you let me know the version of Contact Form 7 you are using I can try to help as best I can.
      Thanks.

      • Andrew

        Hey!

        I am using Contact Form 7 Version 3.5.3.

        2 months later and I am still having issues. Any help would be appreciated. Here is the page where my Contact Form 7 is located: http://www.flatschicago.com/rogers-park-apartments/

        Here is my thank you page: http://www.flatschicago.com/request-sent/

        • Shawn Hayes

          Hi Andrew,
          I tested Solution #1 with Contact Form 7 version 3.5.3 and 3.5.4 and I didn’t have any problems? As mentioned to Ronaldo, that is definitely the easiest way to accomplish a redirect to a thank you page. If you did attempt to use this method make sure you typed the correct code from above in the “Additional Settings” area.

          It should be:

          on_sent_ok: "location = 'http://www.yourdomain.com/thank-you/';"

          Let me know if this still doesn’t work for you and I will try to help you further.

  • Ronaldo

    I use version 3.5.2 of the plugin Contact Form 7 and found the file in the directory / wp-content/plugins/contact-form-7/script.js) localiei the same in
    / wp-content/plugins/contact-form-7/includes/js.
    Edited as shown in your tutorial and it did not work.
    thank you
    _______________________
    Sorry for bad English I am using Google Translator.

    • Shawn Hayes

      Let me look into your version and get back to you.

    • Shawn Hayes

      Hi Ronaldo,

      Okay, so I tested Solution #1 with Contact Form 7 version 3.5.2 and it worked perfectly. Did you try Solution #1? That is definitely the easiest way to accomplish a redirect to a thank you page. If so make sure you typed the correct code from above in the “Additional Settings” area.

      It should be:

      on_sent_ok: "location = 'http://www.yourdomain.com/thank-you/';"

      Let me know if this still doesn’t work for you and I will try to help you further.

  • Josy

    Hello, I am having the same difficulties. What if you have version 3.1.2?

    Please, help me! Thank you!

    • Shawn Hayes

      Hi Josy,

      I haven’t tested version 3.1.2 so I am not sure I could help you with that. I would suggest you upgrade to the newer version and use the above Solution #1.

      Let me know if you have any questions about this.

      Thanks.

  • harsh katiyar

    Hello

    I am craeting the thank you page but the thankyou page are not working fine. I got this code in the scripts.js file

    else if (1 == data.mailSent) {
    $responseOutput.addClass(‘wpcf7-mail-sent-ok’);
    $form.addClass(‘sent’);
    if (data.onSentOk)
    $.each(data.onSentOk, function(i, n) { eval(n) });
    $(data.into).trigger(‘mailsent.wpcf7’);
    }
    and I will add this code

    else if (1 == data.mailSent) {
    $responseOutput.addClass(‘wpcf7-mail-sent-ok’);
    location.href=”http://www.realestatemyhome.com/en/thank-you/”;
    $form.addClass(‘sent’);
    if (data.onSentOk)
    $.each(data.onSentOk, function(i, n) { eval(n) });
    $(data.into).trigger(‘mailsent.wpcf7’);
    }
    but my contact form are stiil not going to the thank you page. please help some body

    • Shawn Hayes

      Have your tried using solution #1? This is usually the best method.

  • Nehemiah

    Below code is working good in Contact Form7 Version 3.8.1. Thanks for your support.

    (Solution #1: Simply put this code in the “Additional Settings” area of the Contact form 7 Admin:)

    on_sent_ok: “location = ‘http://www.yourdomain.com/thank-you/’;”

  • Bladt

    Dosen’t work. I have tested him, but it doesn’t work. What I’m doing wrong? 🙁

    • Shawn Hayes

      What version of Contact Form 7 are you using and which method?

  • hasni

    Contact Form 7 Version 3.4.2

    Dosen’t work.
    on_sent_ok: “location = ‘http://www.google.com’;”

    • Shawn Hayes

      I haven’t tested this on version 3.4.2, but I know it works on earlier versions as well as version 3.5.2. It may be a server issue, but I couldn’t say without testing on your server.

  • Tommy Walinga

    Hi. Does this help me track the conversion code on the thank-you-page?
    Or does it redirect the user to the thank-you-page when pushing submit ?

    • Shawn Hayes

      This redirects the user to a thank you page after submit. Conversion tracking would have to be implemented by a separate service.

  • Tommy Walinga

    I have version 3.4.1 of the Contact form 7. And I have used both solutions.. 1 and 2..

    I will get tracking tomorrow.. maybe it works..

    But I am not redirected to the thank-you page when i press submit..

    • Shawn Hayes

      As mentioned in my previous reply, conversion tracking would have to be implemented by a separate service. Also, I haven’t tested this on version 3.4.1, but I know it works on earlier versions as well as version 3.5.2. It may be a server issue, but I couldn’t say without testing on your server.

  • Tommy Walinga

    Thanks. The conversion is working. I tried both the solution and it tracked double. So i removed one of them now. I have the tracking code on the thank-you-page. But I don’t get redirected to this page. But it looks like the system make a page-count…

    So thanks for the help. Awesome 🙂

  • Graham

    I added the code in the additional settings of the latest version of contact form 7 vers 4.0.1 but no redirection to the thank you page is happening – is it a version issue ? if so what do you advise ?

    • Shawn Hayes

      I haven’t tested this on vers 4.0.1, but I know with previous versions it can sometimes be effected by your theme. Try switching to twenty twelve or another basic theme and see if you are still having the issue.

  • Gayu

    Thanks for your support. This is very useful to me..

    Thank you…

  • Sebastian

    Hello .. i have a question.
    If someone enter directly tothe thank you page without completing the contact . Just paste http://www.yourdomain.com/thank-you/ in the browser.

    The google adwords still count that like a conversion? If it s so … how to avoid it?

    THX

    • Shawn Hayes

      Yes, if someone goes directly to the page then it would count as a conversion. I probably wouldn’t worry about this too much since it should be very minimal false traffic (if any at all).

      The only solution I can think of is to add a cookie to the user on redirect from the form. Then if the user doesn’t have the cookie when they land on the Thank You page, redirect them to another page. Not sure if this would be necessary, but you may also have to change your conversion in analytics to only count the conversion to the page if the visit is longer than a couple of seconds. You would really have to play with it after you setup the redirect.

  • Parvez

    yeretret

  • Sean

    WARNING, using solution #2 will result in one of two things happening down the road. Either: 1. you update your CF7 plugin as new versions (often with security patches) are made available and the above customisation is lost, or; 2. you opt not to update your plugin leaving yourself vulnerable to potential security issues. (Or 3. you make the edit to the plugin file every time you update.)

    Strongly suggest using solution #1

    • Shawn Hayes

      Agreed. If you can solution #1 is the best solution.

  • Green Town Binh Tan

    Hey bro:
    Note: The method using on_sent_ok hook is no longer recommended. This function is scheduled to be abolished by the end of 2017.

    • Shawn Hayes

      Thanks for the heads up. I will update the post to the recommended method.

  • David Betz

    Except that according to the Contact Form 7 Web site solution #1 is deprecated and will be removed by the end of t he year.

    • Shawn Hayes

      Yes, that was mentioned in the comment above as well. I added the recommended solution to the post.

      Thank you.

  • Nick Laubscher

    How do you get the redirect script to work for certain forms and not all. Currently the eventlistener includes all submits on the website but I only need it to work for a few.

    Thank you.

    • Shawn Hayes

      I added an Option #2 to Solution #3 to address this issue. Let me know if you have any questions about this.

  • Ian

    Great guide Shawn, thanks for creating and updating it.

    CF7 redirect stopped working for me just this morning after I upgraded to the latest version. I didn’t even realise the dev was getting rid of on_sent_ok.

    Question about option 2 Fix B – in your example you use page name is contact. What is the page name? Is it the actual name in the page title, or is it the name in the menu system. Can you clarify for me? Thanks

    • Shawn Hayes

      Hi Ian,

      Really sorry for the late reply. It’s been a little crazy over here.

      When using is_page() you can use the Page Title, URL, or the Page ID. They will all work the same.

      Let me know if you have any more questions.

  • Erwin

    Hi Shawn,

    Thanks for the great post. Although the plugin developer argues the need of such feature I appreciate your effort to serve the CF7 community with this clear guide.

    My questions:

    1) will it work also with relative paths to the new destination URL (thank you page)? I am on a multi-site installation with 25 unique ccTLD’s. I can update only one functions.php pointing all to /thank-you/ but not including the domain.

    2) will it work with translations ? could I translate this on page level from a /thank-you/ page to /gracias/ via WPML and that the functions.php still will understand the source is the /thank-you/ page?

    Thank you for your support in this matter.

    • Shawn Hayes

      Hi Erwin,

      These are both great questions! I think you would have to do some testing on your own to get your answers. I actually don’t work with multi-site or WPML. Sorry I couldn’t be of more help.

  • Rasmita

    Hi Shawn Hayes,

    Thanks for this awesome tutorial. You are really a hero. You saved my whole day.

    Thanks a Lot.

    • Shawn Hayes

      You are very welcome!

  • Alfonso

    Hello,
    I wanted to ask for information about Option 2 (Multiple Thank You Page Redirects, Fix B.
    Can its code also be included in the function.php file of my active theme? Or just in the footer.php file?
    Thanks for all the help you can give me.
    Best Regards,
    Alfonso

    • Shawn Hayes

      Hi Alfonso,

      Yes, you can use the wp_footer action hook.
      function my_c7_redirect() {
      //add code from Fix B here
      }
      add_action( 'wp_footer', 'my_c7_redirect' );

      Let me know if you have any issues with this.

      Thanks.

      • Alfonso

        Thank you Shawn Hayes.
        I tried the code but it does not work.
        Could you help me?
        I have placed this code in a plugin that activates the fuctions.php functions of my active theme:
        // Thank you page for single contact form
        function my_c7_redirect () {
        // add code from Fix B here
        // Redirect to Thank you page if your page name is “Free Service – GetResponse”
        if (is_page (‘Free Service – GetResponse’)) {
        ?>

        document.addEventListener (‘wpcf7mailsent’, function (event) {
        location = ‘https://www.alfonsostriano.it/’;
        }, false};

        <? php}
        }
        add_action ('wp_footer', 'my_c7_redirect');

        Is this code correct?

        Thanks for all the help you can give me

        Alfonso

  • Huzan

    Hi,
    I added the script in option one, however it shows page ending as:

    http://www.example.com/campaign-leads.html#wpcf7-f1845-p1841-o1

    instead of http://www.example.com/thank.html

    • Shawn Hayes

      I am not sure why you would have this problem. I have tested this solution and it does work for me.

  • Julie

    thank you! Saw that CF7 was getting rid of the on_sent. I use it for various things from sending people to downloaded content to redirecting to PayPal. thanks so much for the post!

    • Shawn Hayes

      No problem. I am glad this helped!

  • Daniel Gutiérrez

    Thx Shawn! Do you know if is it possible to have multiple cf7 forms in the same page, each one leading to their own thank you page?

  • Brandon Grimes

    Great read! Question for solution #3 option 2…. will this work if you redirect to an offsite link, such as a paypal link?

    Thanks!

    • Shawn Hayes

      Yes, it should allow you to redirect to any page you like.

      Let me know if you have any issues.

  • Chrissy

    I am not a professional programmer and need help figuring out why I can’t get any of the suggestions in this post/comments to work.

    I am currently using:
    Wordpress 4.8.1
    Theme: Oceanic (have tried 5 different ones with same results)
    WP Ultra simple Paypal Cart
    Contact Form 7 plugin (latest version)

    I have it set up to go from Order Now page (http://pekascookiesonline.com/order-now/) –> My Shopping Cart page (http://pekascookiesonline.com/cart/) –> Customer info Form (http://pekascookiesonline.com/uploadimage/) –> Checkout. Everything works except the final Checkout button. It is blank and will not redirect to PayPal.

    I have tried both Contact 7 forms AND Form Maker (as well as a couple others) with no change.

    I tried everything in Solution 1 plus other suggestions but can’t get any of it to work. Looking at Solution 2 I’m not entirely sure how to get to the “root directory” or script.js to make the code edits.

    Any help at all is appreciated…I just need the final checkout button to redirect the correct cart info to paypal so customers can buy their cookies!

    • Chrissy

      I added the script below to the contact/form page, which is the only thing that made it re-direct to the “checkout” page….but the final checkout button is still blank and will not redirect to paypal. The checkout page has [show_wp_shopping_cart] but It gives the paypal error: Things don’t appear to be working at the moment. Please try again later.

      document.addEventListener( ‘wpcf7mailsent’, function( submit ) {
      location = ‘http://pekascookiesonline.com/checkoutpay/’;
      }, false );

    • Shawn Hayes

      Hi Chrissy,

      I am sorry you are having trouble. I would recommend trying the plugin I mention above: https://wordpress.org/plugins/contact-form-7-success-page-redirects/

      If that does not work you may need to seek the help of a web developer. I would recommend trying to find someone on Yelp.com or getting a referral from someone you trust.

      Good luck with everything.

  • Mati

    Hi, I have a form and field of 4 answers. I want the user, after choosing the right answer, to be transferred to the website. Each response should have a different website.

    • Shawn Hayes

      Hi Mati,

      Your question is a little bit out of the scope of this tutorial, but I will try to point you in the write direction.

      So you’re going to want to use Javascript/jQuery to solve your problem. Your field will be a dropdown. Basically what you are going to do is create a script that on change of the dropdown will tell javascript to change the link in the php script depending on what the user selects. Then when the user hits submit it will go to the correct place.

      Here’s a link to some code that will start you off:
      https://stackoverflow.com/questions/11179406/jquery-get-value-of-select-onchange

      Instead of using the alert function as they did in the code on Stack Overflow you are going to want to assign the value to a variable and then pass that variable to the php code in my example.

      If you think this is a bit out of your skillset we can definitely help. Just shoot me an email with your contact information at: info@sharewebdesign.com

      Thank you.

  • Okeke moses

    Thanks for this piece of work. I am trying to set up a conversion tracking for email submission before i came to this page. I have tried the plugin but it did not work. I want to try the solution #3 but I am confused where i should place the code. Should i place the code on my footer.php? Is themes functions.php the same as footer.php?

    • Shawn Hayes

      No, your functions.php file is different than your footer.php file.

      If you are looking to forward all emails to a specific Thank You page you can just place the code from Solution #3:Option 1 (at the very top of this page) in your functions.php. It will run when the wp_footer hook is fired.

      If you need to have multiple email forms going to different conversion Thank You pages then you will want to use Solution #3:Option 2:Fix B. Just place the code after the wp_footer(); function in your themes footer.php file.

      I hope this helps.

  • ary

    I have the plugin “Scripts n Styles” installed. I embeded the snippet suggested in “https://contactform7.com/redirecting-to-another-url-after-submissions/ ” to the tag of that plugin, on the page of the form, like this:
    —————————————————————————————–
    document.addEventListener( ‘wpcf7mailsent’, function( event ) {
    location = ‘http://…..the other page…../’;
    }, false );
    It worked like a charm.

  • Mike

    Thank you for your post. I’ve used the Fix A: Use this plugin
    https://wordpress.org/plugins/contact-form-7-success-page-redirects/

    It saves me a lot time.

    Thank you

  • Jan Bletz

    All solutions work fine for me.

    However, I’d like to redirect visitors to a page based on their input.

    Say I have 2 variables: their age (3 age groups: young, middle-aged, old) and their interests (3 fields of interest: books, movies, music).

    So, there are a 9 combinations possible.
    If someone is young, and interested in music, I’d want to redirect him to a page about Kanye West
    If somone is young, and interested in books, I’d want to redirect him to a page about Harry Potter.
    If momeone is young and interested in movies, I’d want to redirect him to a page about the movie The Hunger games etc.

    This should be possible with the wpcf7mailsent-command… But how?

    Suggestions are much appreciated.

  • Shawn Hayes

    Hi Jan,

    Your question is a little bit out of the scope of this tutorial, but I will try to point you in the write direction.

    I would use some Javascript if/else statements to do what you are looking to do. In your form you would a have dropdown list with:

    Are you interested in:
    1. Music
    2. Books
    3. Movies
    4. etc.

    Then your code in the functions.php…

    //This function prints the JavaScript to the footer
    function add_this_script_footer() { ?>

    <script>
    document.addEventListener( ‘wpcf7mailsent’, function( event ) {

    //Javascript to create a variable that will output the correct url
    if (document.getElementById(“YourDropdownMenuID”).value == “Music”) {
    $thankyoupage = ‘http://yourdomain.com/thank-you-music’;
    } else if (document.getElementById(“YourDropdownMenuID”).value == “Books”) {
    $thankyoupage = ‘http://yourdomain.com/thank-you-books’;
    } else if (document.getElementById(“YourDropdownMenuID”).value == “Movies”) {
    $thankyoupage = ‘http://yourdomain.com/thank-you-movies’;
    } else {
    $thankyoupage = ‘http://yourdomain.com/some-other-page’;
    }

    location = $thankyoupage;

    }, false );
    </script>

    <?php }

    add_action(‘wp_footer’, ‘add_this_script_footer’);

    Obviously you’re going to have to tweak this a bit, but hopefully it will get you going in the right direction.

    I hope this helps.

    Shawn

  • jaspreet

    Hey I need to redirect contact form on the basis of field value.
    For Example?

    Question 1?
    Answer1
    Answer2

    if Answer1 ==> Redirect to thankyou1
    if Answer2 ==> Redirect to thankyou2

    Any Luck?

    All i got thank you pages on contact form id basis not on field value.

    • Shawn Hayes

      This question is a little bit out of scope for this tutorial. You can refer to my answer to Mati’s question above to get started.

      Again, you’re going to want to use Javascript/jQuery to solve your problem. Your field will be a dropdown. Basically what you are going to do is create a script that on change of the dropdown will tell javascript to change the link in the php script depending on what the user selects. Then when the user hits submit it will go to the correct place.

      Here’s a link to some code that will start you off:
      https://stackoverflow.com/questions/11179406/jquery-get-value-of-select-onchange

      Instead of using the alert function as they did in the code on Stack Overflow you are going to want to assign the value to a variable and then pass that variable to the php code in my example.

      Thank you.

Leave a Reply

Your email address will not be published. Required fields are marked *

Featured Posts

Top

Almost there! Please complete this form and click the button below to gain instant access.

Get The Full Guide & Example Files:

It makes setting up your AJAX code super simple!