How to Add custom 404! Page On Blogger

How to Add custom 404! Page On Blogger

In every website, we should have 404! page. 404! or “Page not found” Page is very important. In this post we will learn how to add custom 404! page on blogger.

404! or “Page not found” page very important because when someone types a wrong URL or Clicked on a removed post, URL then they should know that it is an invalid link.

Now the days every new Blogger template contains a 404! page. But we are not going to talk about that because Blogger gives us a place to add custom 404! page why we should not use it for our profit?

At the bottom of this post, I will give you a link to our custom 404! page code. This Code is very special when someone visits on your 404! after 0.8 second it will redirect him to your home page.

The plus point of this code is considered someone clicked on your one of the deleted page/post. Then they will be redirected to our custom 404! page after some second he will be redirected to your home page. When he will redirect your home page and he will find some interesting post on your site he shortly going to visit those post. It will definitely increase your site views.

Let’s see how to add the custom 404! page on Blogger.

To add custom 404! not found you have to d the steps shown below.

  1. Go your blogger dashboard.
  2. settings.

    Blogger settings
    Blogger settings
  3. search preference and where you can find.
  4. Advertisement
  5. Custom page not found.

    Page not found code
    Page not found code
  6. in the side of this option you can find edit option click on it.
  7. a new text box will appear Copy and pest this code in this box from below.
  8. click on save change.
  9. now you can check your blog by putting a wrong URL.

Copy the code below:-

<style type="text/css"> #error-404 { border: 20px solid #1B1B1B; border-radius: 240px 240px 240px 240px; height: 240px; margin: 0 auto 40px; text-align: center; transition: all 0.8s ease 0s; width: 240px; } #error-404:hover { border-color: #333; } #error-404 span { color: #FA4C29; font-size: 100px; font-weight: bold; line-height: 240px; } .large-heading { font-size: 48px; line-height: 1.2em; } .light-heading { font-weight: 400; } .status-msg-bg { background-color: transparent; } .sidebar-wrapper, .page-header { display: none; } .main-wrapper { margin-right: 0; } .outer-wrapper { min-height: 0; } .status-msg-border { border: 0 none; } </style> <div id="error-404"> <span>404</span>
</div> <h2 class="large-heading" style="text-align: center;">Page not found.</h2>
<h3 class="light-heading" style="text-align: center;">Sorry, the page you were looking for on this blog does not exist.<br>You will be redirected shortly to the homepage.</h3>
<script type = "text/javascript">
BSPNF_redirect = setTimeout(function() {
location.pathname= "/"
}, 5000);
If you want Good looking Blogger template then visit this post

45+ Most beautiful SEO friendly Blogger template.



Hi i am a blogger from India. I Love to create and maintain Blog.

Leave a Reply