Redirecting is simply transferring from one particular web page to another. And for this post we are going to redirect a normal and empty blogspot blog to another blog to show you a live example of redirection using the Blogger platform.

redirect-blogspot-to-another-url

For this tutorial you are going to learn the following:
a. Make a Blank Blogger Template which is going to be the starting point of the redirection, and
b. Learn how to redirect that blank blogspot to another web page or URL.

Okay! What is the main reason why you want to have a Blogspot redirecting to another Blogspot, or a domain redirecting to another domain name? Maybe because, your old blogspot or domain is known to your readers already but you already have a new one. For example, your 10 old domain is www.sharingthat.xyz, but you already changed the domain to www.sharingthat.xyz. Since the domain name is already 10 years old, most of your readers will directly type the first domain name into the address bar of their internet browser because they are already used to it. So, if you can just redirect your users to your new one, that will be a big help for them.

Now, we are going to start the tutorial. Please carefully follow the steps below.

STEPS:

1. First, go to your Blogger and create a New Blog.

2. After creating a new blog, access your new blog's Theme HTML. Just click Theme > Edit HTML.

3. Click anywhere inside the HTML code and press CTRL + A (select all). When all the code is selected, press the Delete key to remove all the code.

4. Now, copy and paste the given code below inside the HTML editor of your Theme.
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
 <head>
  <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
  <meta content='1; url = https://www.sharingthat.xyz' http-equiv='refresh'/>
  <b:if cond='data:blog.isMobile'>
   <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
  <b:else/>
   <meta content='width=1100' name='viewport'/>
  </b:if>
  <b:include data='blog' name='all-head-content'/>
  <title><data:blog.pageTitle/></title>
  <b:skin><![CDATA[
   /*
    body {
     font: $(body.font);
     color: $(body.text.color);
     background: $(body.background);
     padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);
     $(body.background.override) margin: 0;
     padding: 0;
    }
 
  ]]></b:skin>
 </head>
 <body>
  <b:section class='main' id='main' showaddelement='yes'/>
  <center>Redirecting! Please wait...</center>
 </body>
</html>

Customize the starting page of your redirection process.

<meta content='1; url = https://www.sharingthat.xyz' http-equiv='refresh'/>

The number 1 is the value in second(s) wherein the redirecting will be triggered. You can adjust the value to make the redirection time to take place much faster or slower once the page is loaded.

The url is the is the other page where your current page is going to redirect. It is simply your destination URL. Change this one to your own URL.

The "Redirecting! Please wait..." is just a sentence to let your readers or visitors know that the page is going to another page or URL. You can change this one if you want.

5. When done, Save your template. Test your code by viewing your blog. See a live example of this tutorial here.

6. Done!

If you have something to share or ask regarding this post, please leave your comment below. Thank you!