In this guide, we are going to show you how to redirect a web page after five seconds.
To carry out this “delayed redirect”, we can use PHP, JavaScript, or an HTML meta tag.
Note that you can easily modify these examples to suit your own needs. For example, if you want it to happen after 2 seconds, then you can simply replace 5 with 2.
Redirect using an HTML meta tag.
If you’re looking for a quick and easy way to redirect the page, then you can place the following meta tag inside the HEAD element of your HTML document:
<!-- This meta tag redirects after 5 seconds--> <meta http-equiv="refresh" content="5;url=https://thisinterestsme.com">
A few points about this method:
- The “http-equiv” tag defines what type of header we are setting. In this case, we gave it the value “refresh”.
- Inside the content property, we declare that we want to redirect to the URL above after 5 seconds. If you want it to redirect after 2 seconds or 10 seconds, then simply replace the number 5.
- Although the client can ignore HTTP headers like this, it will work in most browsers.
- The content of the page WILL be displayed before the refresh takes place.
Redirect using PHP.
You can also create a “delayed redirect” using PHP.
If you are OK with the user seeing the content of the page, then you can use the following example:
//Set Refresh header using PHP. header( "refresh:5;url=https://thisinterestsme.com/code" ); //Print out some content for example purposes. echo 'This is the content.';
If you run the PHP snippet above, you’ll see that the message is displayed for five seconds.
After that, the redirect occurs.
This is basically the same as the first example. The only difference is that we are setting the header using PHP instead of using an HTML tag.
Redirecting with JavaScript.
You can also use JavaScript to redirect the user after a certain period of time:
<script> //Using setTimeout to execute a function after 5 seconds. setTimeout(function () { //Redirect with JavaScript window.location.href= 'https://thisinterestsme.com/javascript'; }, 5000); </script>
In the JavaScript code above, we are using the setTimeout method to execute a function after a set period of time.
Inside the function, we replace the window.location.href property with the URL that we want the user to go to.
In this case, our function simply redirects the user to a different page. Please note that setTimeout’s second parameter must be in milliseconds.
In our example, we set it to 5,000 milliseconds, which equates to 5 seconds. If you want to change that to 2 seconds, then you will need to use 2,000 milliseconds instead.