How to add a time delay on thank you page?

[ozgesila]

Hello,

I would like to add a time delay and redirect to another page in one of my thank-you pages.

For example
1-page with form
2-fill the form and reach the thank-you page
3- after 5 sec. thank you page redirect you another page

[Alex_]

Hey @ozgesila,

You're on the right track as you'll need 3 pages to get this kind of functionality to work: landing page with a form, a thank you page and a "results" page.

This process should work:

• Go into the Design Manager and create a new Javascript file 
• Drop this code in and update as you need to:

console.log('The DOM is ready!');

window.onload = function() {
    if(!window.location.hash) {
      setTimeout(function() {
        window.location = "{{ link to results page }}";
      }, 5000);
    }
};

• While in the Deisgn Manager, click Actions and choose the "Copy public URL" option
• Go back to the editor of your thank you page, click on the Settings tab, scroll down and click on Advanced options, scroll down some more and drop this code in the Footer HTML section under Additional code snippets:

<!-- start Main.js Do Not Remove -->
<script src='{{ get_asset_url('/public URL js') }}'></script>
<!---End Main.js-->

• Within the parenthesis portion of the "get_asset_url" script, paste the public URL that you've copied from the js file you've just created

After you've added the Thank You page URL to the js file in the Design Manger, you should be good to test.

A little caution with this as the Thank You page will redirect to the Results page, even when in the editor so it'll look like the page you're editing is different, but that's just the js firing; it's not actually redirecting you to another page. It just looks like it. So to avoid any real confusion, make all of your edits before you drop that code into the Footer HTML section.

Also, it'd be a good idea to publish each page so you'll have the links you'll need for the js file to fire correctly.

When you're all done, it should work like this: Form submission page > Thank you page (wait for 5 seconds) > Results page.

Hopefully this helps.

[davidls7 · Accepted solution]

Hi Ozgesila 

One way this can be done by adding a piece of JavaScript in the head of the thank you page in the page settings. 

This code fires when the page loads, waits 2 seconds (2000 ms) and then redirects to the url on the fourth line.

<script>
	window.onload = function(){
	 setTimeout(function(){
	   window.location.href = "http://www.mysite.com/new-page";
	 }, 2000);
	};
</script>

I hope that helps, 

- David

[semonbright]

window.location.replace('http://w3c.com');

It’s better than using window.location.href = 'http://w3c.com';

Using replace() is better for javascript redirect , because it does not keep the originating page in the session history, meaning the user won’t get stuck in a never-ending back-button fiasco.