How to redirect one HTML page to another on load

Question

Is it possible to set up a basic HTML page to redirect to another page on load?

Use .htaccess or IIS equivalent to do a server-side redirect. That way, even if your physical page disappears, the redirect will still work. — flith, Nov 13 '17 at 11:29
That insider.zone tool made my redirects all lower case, causing 404s. Plus there is no way to contact whoever made the page about it. — Dan Jacobson, Jan 23 '19 at 07:42

score 2384 · Accepted Answer · edited Apr 26 '22 at 19:26

2384

Try using:

<meta http-equiv="refresh" content="0; url=http://example.com/" />

Note: Place it in the <head> section.

Additionally for older browsers if you add a quick link in case it doesn't refresh correctly:

<p><a href="http://example.com/">Redirect</a></p>

Will appear as

Redirect

This will still allow you to get to where you're going with an additional click.

edited Apr 26 '22 at 19:26

David d C e Freitas

7,481
4
58
67

answered Mar 23 '11 at 21:00

Valerij

27,090
1
26
42

161

Use of meta refresh is discouraged by the World Wide Web Consortium (W3C). Ref: http://en.wikipedia.org/wiki/Meta_refresh. So it is reccomended to use server redirect instead. JavaScript redirects may not work on all the mobile phones as JavaScript might be disabled. – NinethSense Jul 30 '12 at 06:14
check the answer by Alex K, also php's `header` and nodejs' `response.writeHead` – Valerij Mar 26 '13 at 23:56
71

FYI, the `0` means to refresh after 0 seconds. You may want to give the user some more time to know what's happening. – Dennis Sep 11 '13 at 20:34
122

@NinethSense's comment makes meta refresh seem like a JavaScript redirect. Meta refresh is **not** JS and will still work when JS is disabled. – Druska Dec 28 '13 at 19:47
1

@Druska. My JS comment is a different sentence. Also, age changed too fast. Now almost all mobile devices support JS. – NinethSense Jan 03 '14 at 06:30
6

@NinethSense discouraged for refresh ("since unexpected refresh can disorient users"), but the question is about redirection. – Koen. Mar 04 '14 at 22:15
@NinethSense You can use both like Google does when they want to hide referrer from search engine. And I want to implement the same thing for my URL shortening service as optional feature. – Lamp town guy Apr 16 '14 at 08:50
1

Here's another page where the W3C discourages meta refresh: [Use standard redirects: don't break the back button!](http://www.w3.org/QA/Tips/reback) . – Wilson F Nov 18 '14 at 16:53
1

Instead of getting a white screen, i put a picture of the website you're being redirected to :D On another website, i redirected to home.php from index.php so i did – halmi4 Dec 31 '14 at 17:47
2

Dennis - I think the user will have a better idea of what's happening without a delay - they have presumably just clicked a link or similar so what's happening is that its loading. They don't have to know that a redirect is involved. I think it would be more confusing if it loads, then there's a delay, and then something else happens. – bdsl Jun 11 '15 at 10:57
Can the URL be relative? – Merchako Jul 31 '15 at 14:51
1

@Merchako yes it can – Dec 17 '16 at 21:23
placing this inside a folder inside a simple html file and calling it index.html create a kind of redirect... at least you do not have to add any ".html" at the end... – Alex Cio May 21 '17 at 23:38
@Dennis 0 seconds is fine, the user doesn't care that he is being redirected, they don't want to know. – TZubiri Mar 27 '19 at 17:38
Would such a redirect break the browser's SSL connection, if the server had valid SSL certificate according to the URL the visitor used in his browser, and if the redirect target would not have SSL and was addressed with its static IP, like: ? – jamacoe Jul 06 '21 at 07:57
1

@NinethSense All browsers and search engines support it and it's the recommended way if you can only change the html document and nothing else. Ref: https://developers.google.com/search/docs/crawling-indexing/301-redirects – Nobody Dec 28 '22 at 21:11
@NinethSense You mentioned W3C discourages redirects. Koen mentioned that they say redirects can "disorient users." But another potential drawback is an accessibility issue: If the redirect time is short but non-zero, users may have difficulty navigating backwards (using the back button) through the redirect page. As long as this concern is taken into consideration, I don't think it matters whether a server redirect or HTTP redirect is used. Of course, HTTP redirects are preferred if the server supports them. – Josiah Yoder Jan 31 '23 at 14:40
Do not use `http-equiv="refresh" `. Timed refresh must not exist as it would have a critical impact on users. This would breach Guidelines: WCAG 2.1 (A), WCAG 2.0 (AA), and it will be marked as error by major web browsers today. Use javascript as recommended instead. You can read more here: https://dequeuniversity.com/rules/axe/4.4/meta-refresh – Goemon Code May 19 '23 at 18:10

Billy Moon · Answer 2 · 2017-12-08T14:11:16.433

1204

I would use both meta, and JavaScript code and would have a link just in case.

<!DOCTYPE HTML>
<html lang="en-US">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="refresh" content="0; url=http://example.com">
        <script type="text/javascript">
            window.location.href = "http://example.com"
        </script>
        <title>Page Redirection</title>
    </head>
    <body>
        <!-- Note: don't tell people to `click` the link, just tell them that it is a link. -->
        If you are not redirected automatically, follow this <a href='http://example.com'>link to example</a>.
    </body>
</html>

For completeness, I think the best way, if possible, is to use server redirects, so send a 301 status code. This is easy to do via .htaccess files using Apache, or via numerous plugins using WordPress. I am sure there are also plugins for all the major content management systems. Also, cPanel has very easy configuration for 301 redirects if you have that installed on your server.

edited Dec 08 '17 at 14:11

answered Mar 23 '11 at 21:04

Billy Moon

57,113
24
136
237

17

This redirect page can be much more concise with HTML5: http://pastebin.com/2qmfUZMk (which works in all browsers, and passes w3c validation) – enyo Apr 29 '13 at 13:28
14

@enyo I am not a big fan of dropping the `body` tags and the like. Perhaps it validates, and perhaps works in common browsers. I am sure there are some fringe cases it causes issues, and the benefit seems small. – Billy Moon Apr 29 '13 at 15:52
@BillyMoon Why should we not tell the user to 'Click' the link? – sousdev Feb 05 '14 at 12:30
13

@Fricker because they might not be clicking. They might be controlling via voice, tapping, or navigating in some unknown way. It is an accessibility guideline to follow standards for controls, like using standard HTML A attribute for link, and to think of it, and communicate it as a link, and not to prescribe how someone must interact with it. Also, having `click here` on a link is not advised, as the screen reader will be harder to navigate. Links should be on text describing the destination, so the user knows where they will arrive before following it, and however they interact with it. – Billy Moon Feb 05 '14 at 18:45
1

@BillyMoon There are 3 different "links" in that example. Is it possible to create a page like this, where all three are relative instead of absolute links? – Sam Harwell Feb 19 '14 at 14:18
2

@BillyMoon, Actually the meaning of "click" has already been overloaded to include all those meanings as well. "click" will do fine. – Pacerier Oct 21 '14 at 10:45
You can't use 301 with the other methods! First, the html page won't be sent if the server sends an 301, so it's sent instead of the page. Second, clients will ignore any html if they receive a 301 redirect. – DarkWingDuck Apr 11 '15 at 21:36
2

@BillyMoon under what occasional circumstances the browser ignore 0 value meta refresh? Thanks! – Gal Margalit Sep 04 '15 at 13:38
Hello! how can I do that the link will open in another page? – Elidor Sep 10 '16 at 18:23
for older browsers use: ``Having the javascript in a html comment prevents it from being rendered, which looks sloppy. – JustinCB Nov 15 '16 at 16:49
@JustinC.B. how old are we talking here..? – Billy Moon Nov 15 '16 at 21:31
Very old. Some browsers that strictly conform to xhtml won't work with that. You can use ``. Sloppy looking first lines of JavaScript are better than sloppily rendering javascript all over the place in my opinion(others might disagree or say old browsers shouldn't be used anyway). – JustinCB Dec 20 '16 at 21:59
1

It reminds me of a joke where a person bought 2 tickets just in case 1 is lost, and then he already had the annual pass, just in case he lost both – Suresh Kaushik Jun 23 '17 at 20:57
I would surroung the meta stuff with noscript tag, just to be sure it is used only if javascript is disabled. – azerty Oct 25 '17 at 12:58
1

For posterity, the time when `Stack Overflow ranks #2 for Google Search for "Stack Overflow"`: https://news.ycombinator.com/item?id=5311151 – Billy Moon Dec 12 '17 at 22:36
1

^ That's amazing. For someone's future edification, perhaps: I have an exported local mirror of some content trees, from a tool that writes sparse `index.html` redirect-wrappers when mirroring text files, and just had to write a script to replace `` tags with the equivalent JavaScript `window.location=` script in every `index.html` wrapper, because it seems Firefox at some point stopped respecting `` tags in `file:///` documents. The JavaScript redirection still works fine. – FeRD Feb 24 '18 at 13:55
This can open the link two times – Leandro Bardelli Jul 27 '21 at 15:38

score 151 · Answer 3 · edited Mar 20 '19 at 22:08

151

JavaScript

<script type="text/javascript">
    window.location.href = "http://example.com";
</script>

Meta tag

<meta http-equiv="refresh" content="0;url=http://example.com">

edited Mar 20 '19 at 22:08

miike3459

1,431
2
16
32

answered Mar 23 '11 at 21:01

amit_g

30,880
8
61
118

Doesn't seem to work for a HTML page in Angular app. Is there any to fix it? – RedBottleSanitizer Feb 14 '22 at 22:33

score 43 · Answer 4 · edited Jun 25 '16 at 19:10

43

I would also add a canonical link to help your SEO people:

<link rel="canonical" href="http://www.example.com/product.php?item=swedish-fish"/>

edited Jun 25 '16 at 19:10

Peter Mortensen

30,738
21
105
131

answered Feb 06 '12 at 00:34

lrkwz

6,105
3
36
59

4

You would use a canonical link in addition to a redirect? http://en.wikipedia.org/wiki/Canonical_link_element says that Google prefers use of a redirect *instead of* a canonical link. – LarsH Nov 19 '13 at 15:51
1

@larsH So what most important to SEO, is it the redirect link or final destination page? – Lexus de Vinco Feb 26 '14 at 16:50
1

@Chakotay See: [When Should You Choose Canonical vs. 301 Redirect?](https://stackoverflow.com/questions/5411538/redirect-from-an-html-page) – Marc.2377 Apr 01 '19 at 19:33
If the redirection is because someone is trying to access a file outside the scope of root operation i.e. an include file or a file that presents the fact that you are accessing in an illegal manner it is likely that the page redirect is outside the scope of google access anyway. I know not all bots respect the robots.txt file though. Just a thought – Ernest Allen Buffington Sep 06 '22 at 05:53

score 37 · Answer 5 · edited Jan 25 '23 at 15:07

This is a sum up of every previous answers plus an additional solution using HTTP Refresh Header via .htaccess

HTTP Refresh Header

First of all, you can use .htaccess to set a refresh header like this
```
Header set Refresh "3"
```
This is the "static" equivalent of using the header() function in PHP
```
header("refresh: 3;");
```
Note that this solution is not supported by every browser.

JavaScript

With an alternate URL:

<script>
    setTimeout(function(){location.href="http://example.com/alternate_url.html"} , 3000);
</script>

Without an alternate URL:

<script>
    setTimeout("location.reload(true);",timeoutPeriod);
</script>

Using the window object:

<script>
    window.location.reload(true);
 </script>

Meta Refresh

You can use meta refresh when dependencies on JavaScript and redirect headers are unwanted

With an alternate URL:

<meta http-equiv="Refresh" content="3; url=http://example.com/alternate_url.html">

Without an alternate URL:

<meta http-equiv="Refresh" content="3">

Using <noscript>:

<noscript>
    <meta http-equiv="refresh" content="3" />
</noscript>

Optionally

As recommended by Billy Moon, you can provide a refresh link in case something goes wrong:

If you are not redirected automatically: <a href='http://example.com/alternat_url.html'>Click here</a>

Resources

Do not call `setTimeout` with a string. Pass a function instead. — Oriol, Nov 28 '16 at 20:07
"HTTP Refresh Header via .htaccess" - why it is relevant in question asking about redirect from HTML page? — reducing activity, Jul 11 '18 at 08:01
If you can do a redirect from the HTTP headers (such as in `.htaccess`) then you should use a 301 or 302 redirect, not a refresh. — Simon East, Oct 07 '21 at 06:13

score 30 · Answer 6 · edited Jul 11 '18 at 21:37

If you are looking forward to follow modern web standards, you should avoid plain HTML meta redirects. If you can not create server-side code, you should choose JavaScript redirect instead.

To support JavaScript-disabled browsers add a HTML meta redirect line to a noscript element. The noscript nested meta redirect combined with the canonical tag will help your search engine rankings as well.

If you would like to avoid redirect loops, you should use the location.replace() JavaScript function.

A proper client-side URL redirect code looks like this (with an Internet Explorer 8 and lower fix and without delay):

<!-- Pleace this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://stackoverflow.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0; URL=https://stackoverflow.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://stackoverflow.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->

https://www.w3.org/TR/WCAG10-HTML-TECHS/#meta-element includes details on why ` — daxelrod, Feb 19 '16 at 16:07
The arguments which the w3c provides against HTML redirects also apply to Javascript redirects. Additionally, Javascript redirects require javascript enabled, in contrast to HTML redirects. Therefore HTML redirects are strictly better than Javascript redirects in cases where one can use both. — Max, May 28 '20 at 19:12
@Max. Yes, exactly. The w3c states, "However, users should not redirect users with this markup since is non-standard, it disorients users, and it can disrupt a browser's history of visited pages." This is now a de-facto standard, so it SHOULD be used if usability issues are given proper concern. — Josiah Yoder, Jan 31 '23 at 14:44
@Max and of course, usability issues are equivalent with meta or with javascript, just as you say. There is no difference if a zero timeout is used. — Josiah Yoder, Jan 31 '23 at 14:46

score 29 · Answer 7 · edited Jun 27 '23 at 14:50

The following meta tag, placed inside the head, will tell the browser to redirect:

<meta http-equiv="Refresh" content="seconds; url=URL">

Replace seconds with the number of seconds to wait before it redirects, and replace the URL with the URL you want it to redirect to.

Alternatively, you can redirect with JavaScript. Place this inside of a script tag anywhere on the page:

window.location = "URL"

score 27 · Answer 8 · edited Feb 26 '15 at 12:38

27

It would be better to set up a 301 redirect. See the Google's Webmaster Tools article 301 redirects.

edited Feb 26 '15 at 12:38

RickyA

15,465
5
71
95

answered Feb 21 '13 at 15:18

Alex K

487
1
5
6

17

The question specifically asks for a basic .html page. I guess asker can't modify .htaccess or similar (for instance using Github Pages or similarly limited hosting). 301 is not doable in such cases – Nicolas Raoul Aug 02 '13 at 01:24

score 18 · Answer 9 · edited Mar 02 '13 at 23:42

18

You could use a META "redirect":

<meta http-equiv="refresh" content="0; url=http://new.example.com/address" />

or JavaScript redirect (note that not all users have JavaScript enabled so always prepare a backup solution for them)

<script language="javascript">
  window.location = "http://new.example.com/address";
</script>

But I'd rather recommend using mod_rewrite, if you have the option.

edited Mar 02 '13 at 23:42

Kamil Kisiel

19,723
11
46
56

answered Mar 23 '11 at 21:01

Czechnology

14,832
10
62
88

5

mod_rewrite (only) applies to Apache. – Paul Draper Sep 05 '14 at 21:55
1

Regarding Apache: Why mod_rewrite and not a simple Redirect directive without and extra module? – vog Mar 02 '17 at 10:22

score 14 · Answer 10 · edited Jun 25 '16 at 19:08

14

As soon as the page loads, the init function is fired and the page is redirected:

<!DOCTYPE html>
<html>
    <head>
        <title>Example</title>
        <script>
            function init()
            {
               window.location.href = "www.wherever.com";
            }
        </script>
    </head>

    <body onload="init()">
    </body>
</html>

edited Jun 25 '16 at 19:08

Peter Mortensen

30,738
21
105
131

answered Apr 14 '15 at 16:52

kkk

1,850
1
25
45

score 11 · Answer 11 · edited May 19 '18 at 17:11

11

Place the following code between the <HEAD> and </HEAD> tags of your HTML code:

<meta HTTP-EQUIV="REFRESH" content="0; url=http://example.com/index.html">

The above HTML redirect code will redirect your visitors to another web page instantly. The content="0; may be changed to the number of seconds you want the browser to wait before redirecting.

edited May 19 '18 at 17:11

Peter Mortensen

30,738
21
105
131

answered Feb 02 '12 at 19:07

Muhammad Saqib

2,185
3
35
48

score 9 · Answer 12 · edited May 26 '22 at 12:06

9

I use a script which redirects the user from index.html to relative url of Login Page

<html>
  <head>
    <title>index.html</title>
  </head>
  <body onload="document.getElementById('lnkhome').click();">
    <a href="/Pages/Login.aspx" id="lnkhome">Go to Login Page</a>
  </body>
</html>

edited May 26 '22 at 12:06

Sangwin Gawande

7,658
8
48
66

answered Dec 31 '14 at 16:40

Zolfaghari

1,259
1
15
14

1

Redirect url in above method can be relative. e.g: you want to redirect to Login page or any relative page by index.html in root of website. don't need to know your domain name. but when you set window.location.href="xxx"; you must know domain name. – Zolfaghari Aug 12 '18 at 11:21

score 9 · Answer 13 · edited Jun 25 '16 at 19:07

I found a problem while working with a jQuery Mobile application, where in some cases my Meta header tag wouldn't achieve a redirection properly (jQuery Mobile doesn't read headers automatically for each page so putting JavaScript there is also ineffective unless wrapping it in complexity). I found the easiest solution in this case was to put the JavaScript redirection directly into the body of the document, as follows:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="refresh" content="0;url=myURL" />
    </head>

    <body>
        <p>You are not logged in!</p>
        <script language="javascript">
            window.location = "myURL";
        </script>
    </body>
</html>

This seems to work in every case for me.

score 9 · Answer 14 · edited Jan 26 '18 at 09:02

9

You can auto redirect by HTTP Status Code 301 or 302.

For PHP:

<?php
    Header("HTTP/1.1 301 Moved Permanently");
    Header("Location: http://www.redirect-url.com");
?>

edited Jan 26 '18 at 09:02

Flexo

87,323
22
191
272

answered Dec 04 '15 at 09:35

Vô Vị

183
1
2

8

That is not a redirect from an HTML page. – bugmenot123 May 02 '17 at 09:53

score 9 · Answer 15 · edited Apr 19 '13 at 18:28

9

Put the following code in the <head> section:

<meta http-equiv="refresh" content="0; url=http://address/">

edited Apr 19 '13 at 18:28

Peter Mortensen

30,738
21
105
131

answered Mar 23 '11 at 21:14

Sebi

1,390
1
13
22

score 8 · Answer 16 · edited Sep 03 '14 at 15:22

The simple way which works for all types of pages is just to add a meta tag in the head:

<html>
    <head>
        ...
        <meta HTTP-EQUIV="REFRESH" content="seconds; url=your.full.url/path/filename">
        ...
    </head>
    <body>
        Don't put much content, just some text and an anchor.
        Actually, you will be redirected in N seconds (as specified in content attribute).
        That's all.
        ...
    </body>
</html>

score 7 · Answer 17 · answered Nov 13 '13 at 22:25

7

You should use JavaScript. Place the following code in your head tags:

<script type="text/javascript">
 window.location.assign("http://www.example.com")
</script>

answered Nov 13 '13 at 22:25

kriscross07

169
3
5

score 6 · Answer 18 · edited May 19 '18 at 17:14

6

Just use the onload event of the body tag:

<body onload="window.location = 'http://example.com/'">

edited May 19 '18 at 17:14

Peter Mortensen

30,738
21
105
131

answered Feb 14 '17 at 18:51

pat capozzi

1,412
1
20
16

2

Just a note, this will only work if javascript is enabled, if you need support clients without javascript use the `meta` tag method instead – Andy Braham Nov 30 '20 at 14:22

Edward · Answer 19 · 2021-10-08T14:41:52.763

5

Just for good measure:

<?php
header("Location: http://example.com", true, 302);
exit;
?>

Make sure there are no echo's above the script otherwise it will be ignored. http://php.net/manual/en/function.header.php

edited Oct 08 '21 at 14:41

answered Jun 11 '13 at 15:39

Edward

1,806
5
26
36

11

The question specifically asks for a basic .html page. I guess asker can't modify .htaccess or similar (for instance using Github Pages or similarly limited hosting). PHP is not available in such cases. – Nicolas Raoul Aug 02 '13 at 01:25
1

I would consider something generated by PHP (Pre-Hypertext Processor) a "basic HTML page". Nowhere in the question did it mention a file type. – Edward Jul 20 '18 at 16:20
2

Eeek. Why status 303? I've never seen that before. And why are you redirecting to an email address (an invalid URL), anyway? – Simon East Oct 07 '21 at 06:16
1

@SimonEast no idea, i dont remember putting those values in even though it was 8 years ago! fixed anyway. – Edward Oct 08 '21 at 14:45

score 5 · Answer 20 · edited Jun 25 '16 at 19:05

5

Razor engine for a 5 second delay:

<meta http-equiv="Refresh"
         content="5; url=@Url.Action("Search", "Home", new { id = @Model.UniqueKey }))">

edited Jun 25 '16 at 19:05

Peter Mortensen

30,738
21
105
131

answered Oct 08 '15 at 16:09

JoshYates1980

3,476
2
36
57

score 5 · Answer 21 · answered Jul 10 '17 at 02:35

5

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Redirect to a page</title>
    </head>
    <body onload="window.location.assign('http://example.com')">

    </body>
</html>

answered Jul 10 '17 at 02:35

PoM

161
2
12

score 5 · Answer 22 · edited May 19 '18 at 17:15

5

As far as I understand them, all the methods I have seen so far for this question seem to add the old location to the history. To redirect the page, but do not have the old location in the history, I use the replace method:

<script>
    window.location.replace("http://example.com");
</script>

edited May 19 '18 at 17:15

Peter Mortensen

30,738
21
105
131

answered Apr 25 '18 at 12:41

Paul Ogilvie

25,048
4
23
41

score 4 · Answer 23 · edited Sep 17 '22 at 16:30

This is a redirect solution with everything I wanted, but I could not find in a nice clean snippet to cut & paste.

This snippet has a number of advantages:

lets you catch and retain any querystring parameters folks have on their URL
makes the link unique to avoid unwanted caching
lets you inform users of the old and new site names
shows a settable countdown
can be used for deep-link redirects as retains parameters

How to use:

If you migrated an entire site then on the old server stop the original site and create another with this file as the default index.html file in the root folder. Edit the site settings so that any 404 error is redirected to this index.html page. This catches anyone who accesses the old site with a link into a sub-level page etc.

Now go to the opening script tag and edit the oldsite and newSite web addresses, and change the seconds value as needed.

Save and start your website. Job done - time for a coffee.

<!DOCTYPE html>
<html>
<head>
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">
<style>
body { margin: 200px; font: 12pt helvetica; }
</style>

</head>
<body>

</body>
<script type="text/javascript">

// Edit these to suit your needs.
var oldsite = 'http://theoldsitename.com'
var newSite = "https://thenewsitename.com";
var seconds = 20;  // countdown delay.

var path = location.pathname;
var srch = location.search;
var uniq = Math.floor((Math.random() * 10000) + 1);
var newPath = newSite + path + (srch === '' ? "?" + uniq : srch + "&" + uniq);


document.write ('<p>As part of hosting improvements, the system has been migrated from ' + oldsite + ' to</p>');
document.write ('<p><a href="' + newPath + '">' + newSite + '</a></p>');
document.write ('<p>Please take note of the new website address.</p>');
document.write ('<p>If you are not automatically redirected please click the link above to proceed.</p>');
document.write ('<p id="dvCountDown">You will be redirected after <span id = "lblCount"></span>&nbsp;seconds.</p>');

function DelayRedirect() {
    var dvCountDown = document.getElementById("dvCountDown");
    var lblCount = document.getElementById("lblCount");
    dvCountDown.style.display = "block";
    lblCount.innerHTML = seconds;
    setInterval(function () {
        seconds--;
        lblCount.innerHTML = seconds;
        if (seconds == 0) {
            dvCountDown.style.display = "none";
            window.location = newPath;
        }
    }, 1000);
}
DelayRedirect()

</script>
</html>

score 3 · Answer 24 · edited May 21 '17 at 11:20

3

You don't need any JavaScript code for this. Write this in the <head> section of the HTML page:

<meta http-equiv="refresh" content="0; url=example.com" />

As soon as the page loads at 0 seconds, you can go to your page.

edited May 21 '17 at 11:20

Peter Mortensen

30,738
21
105
131

answered Jul 05 '16 at 15:15

Yash Jain

1
5
20

3

this is already covered in the accepted answer & top comments - consider editing the answer than posting a duplicate one – RozzA Sep 05 '16 at 05:09

How to redirect one HTML page to another on load

24 Answers24

JavaScript

Meta tag

Linked

Related