Monday, 20 August 2012

How to set custom Page Not Found or error 404

| Monday, August 20, 2012 | |

When you open a website or a page, it sends a request to the server where the files are and then the server sends the files and you get access to your requested web page. But if the page do not exists on server it shows an error 404 means Page Not Found. Blogger by default has a error 404 page which is displayed when such conditions occur.
But recently Blogger has given its users privileged to edit and have custom Page Not Found message.

  1. Just open your blog.
  2. Go to Settings> Search Preferences.
  3. In Errors and redirections you will find Custom Page Not found just edit it.
But I am not here to tell you to put some text in it. When you have the access then do something more. Below is my Custom 404 page's screenshot.
I have my logo followed by my message and then finally a search box so that users can search for something else instead of going away.

How to make your Custom Page Not Found?

Now, as you see you can figure out that HTML coding is required but I say 'no'. Just learn to play and find some way out.

  1. Open up you Blogger's editor and create a new post.
  2. Put your image in it make it align center.
  3. Choose you fonts and font size.
  4. Add your custom message if any.
  5. Now click on HTML tab just adjacent to Compose tab in Blogger's editor.
  6. In HTML tab you will find your required HTML codes, just copy it all and paste it in Custom Page Not Found section.
  7. Save it.

Adding a search box?

Here, you do require to copy paste this code just after completing step 6 above. Here is the code-
<form id="searchThis" action="/search" style="display:inline;" method="get"><input id="searchBox" name="q" type="text"/> <input id="searchButton" value="Search" type="submit"/></form>

How to preview it?

To make sure that everything is going right, you need to preview you page. It is simple just open a new tab and then open a link and edit it a bit. Like add an extra letter.
Related Posts with Thumbnails

No comments:

Post a Comment