In this post we will check out how to create a custom 404 page for your blog. You probably already know the meaning of Error 404, i.e. "Page not found". It is the response error shown by the server whenever the requested page is not present or has been moved somewhere else.

In that case a user will be shown a default 404 page, which is not recommended. If you want your blog to be more user-friendly, you should create your own 404 page, so that the user does not get annoyed and can be shown a custom message or a way back to your content. In this post we will focus on showing a custom 404 page (not a redirect).

First, you need to design a simple HTML page that you want to be shown to your visitors. Don't worry if you don't know how to create HTML pages — you can use the one shared in this post, complete with its CSS.

How to add a custom 404 page in Blogger

Log in to your Blogger account.
Navigate to your dashboard and click on Settings.
Click on Search Preferences.
Under Errors and redirections, click Edit next to Custom Page Not Found.
Add the following HTML code in the box:

<style>
  .error-404 {
    text-align: center;
    font-family: Georgia, "Times New Roman", serif;
    padding: 40px 20px;
  }
  .error-404 h2 {
    font-size: 28px;
    margin-bottom: 12px;
  }
  .error-404 a {
    color: #1e598e;
    font-weight: bold;
  }
</style>
<div class="error-404">
  <h2>Oops! Page not found (Error 404)</h2>
  <p>Sorry, the page you are looking for does not exist or has been moved.</p>
  <p><a href="https://www.yourblog.com/">&#8592; Go back to the homepage</a></p>
</div>

Click on Save changes and you are done.

You have successfully added a custom 404 error page to your blog. Now, whenever a user comes across a URL that is not present in your blog, they will be shown this page instead of the default error. One small edit is required: replace the homepage URL in the code above with the URL of your own blog.

How to Add a Custom 404 Page to Blogger

How to add a custom 404 page in Blogger

Recommended articles