domdomrung

Blogger brings in 404 pages, redirect services

One of the major disadvantages of using blogger was its lack of customizability. To begin with, since your blog was hosted on the servers of Google, with a sub domain, you weren’t even offered basic functionalities, when compared to the freedom you get when you are using self hosted Wordpress on your own server.
To solve this problem, Blogger introduced a whole new set of amazing features, present in the “Search Preferences” option in settings.

The search preferences consists of three settings:
  1. Meta tags – which can be used to provide search description when your website appears in search results
  2. Errors and redirects – which can be used to set a 404 page in case of page not found errors, and also be used to redirect visitors from one URL in your site to another.
  3. Crawlers and Indexing – which lets you manually edit the robots.txt file and its header, for better indexing by search engines.

Error redirection

This is probably the most exciting, much awaited feature blogger has implemented. Earlier, if you visited a page that does not exist, you would be greeted with “Sorry, the page you were looking for in this blog does not exist.” error from blogger. But now, if you try to visit this http://www.mybloggertricks.org/404, then you would be greeted with a custom 404 page that I have created for my blog.
However, when you try to create a 404 page, the message will be displayed in a gray box, without any formatting (unlike the 404 page of this blog). To overcome this, you would have to use HTML, CSS and even JavaScript together.
Here is the code of my 404 page, which you can modify and use it with your blogger blog too.
 <script type="text/javascript">
document.title = "404 - Page not found"; //title of the page

</script>

<div style="text-align:left;background-color:#ffffff;margin:5px;">

<h2>Error! 404 Page not found.</h2>

<p>There has been a problem.</p><br/>

<p>It looks like, for some reason, that the article/page/thing you were searching for here is not found - bringing you to this page instead.</p>
<br/>

<h3>So what do you do? </h3>

<ul>

<li>Browse through the <a href="http://www.mybloggertricks.org/">archives</a> till you find what you were looking for.</li>

<li>Go to the <a href="http://www.mybloggertricks.org/">homepage</a>.</li>
</ul>

</div>

<style type="text/css">

.status-msg-bg { visibility: hidden !important;}

.status-msg-border {border: 0 none !important;}

</style>

Working: The JavaScript at the top changes the title of the page to the red text. The green text is what would be displayed as the body of the 404 page, which can be edited and replaced with your blog’s URL. The <style> tag in the last is the important part of the code which overrides the gray background and hides it permanently.


You can set a meta description too, unless you already have one implemented in the theme of your blog.May you like other post 404 here:Automatically Redirect Blogger 404 Error Pages to Home
Labels: ,