» » » How to Make Stylish 404 Error Page For Blogger

How to Make Stylish 404 Error Page For Blogger

,
404 error message icon
When someone tries to get into the page that is not existed, then server default shows 404 error page. It obviously means that the page that you are trying to get into is not available recently. So this can be little bit bad for the users when they see this message. But if you write this message in the another way to make them exciting about your page. For this, you can add a custom 404 error page with custom image which can make your visitors very exciting about your blogs. So in order to customize this message, I wrote some techniques here. Just follow the tips and enjoy blogging.

Some blogger just want to change the message and just want to show custom message. So if you are this type of blogger, just enter into your dashboard and go to setting and click on search preference and just type your custom message.
error message

Now if you want to add stylish 404 message with image, then just follow these instructions.
  • First of all go to your blogger account. 
  • Now press ctrl+f and find the </head> then just paste the below code above it.
<b:if cond='data:blog.pageType == "error_page"'><style type="text/css">.status-msg-wrap{font-size:100%;margin:none;position:static;width:100%}.status-msg-border{display:none}.status-msg-body{padding:none;position:static;text-align:inherit;width:100%;z-index:auto}.status-msg-wrap a{padding:none;text-decoration:inherit}</style></b:if>

  • Click on Save Template.
  • Now change the error page style.
  • Just go to the setting of your blogger and click on search preferences.
  • Paste the following code into the custom page not found field as shown in the above figure.
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2><h3 style="font-size:17px;">Sorry, This Page is not available....!<br><a href="/">Click here</a> to go to Homepage <br> Have a great Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYu8G_Yz6PAyfwHg1aUyBMR_T5nJTfC6D3WPmJ-Iw_c9EmeM0c7vr_7uhQNGFkDVBmVUvqTdX58jJHVieFuA2xLU_AfsH6wnMwnjVhnMqAEUZIjs5oRP9Oy6xPSHUl4sjfD7mirL1oXCML/s1600/404.png"/>
  • Now save it.
 You have done successfully. Thanks for visiting our site. Enjoy Blogging.