404 Error Page In Blogger

 404 Error Page in Blogger Blog or custom redirects blogger adds custom page not found. It is a very important page for our blog because when the visitor can visit our blog and if they can put the wrong URL (post URL) than 404 Error Page is Respond.

These are followed Steps:-

Step 1: Go to Blogger Settings and click Search preferences link, then click the Edit link in the Custom Page Not Found? Option.

Step 2: Paste the code in the box and click the Save changes button.

Copy 404 Error Page Code:-

<div class='error-custom'>
<h2>404 Not Found</h2>
<p class='error-body'>We&#39;re sorry but we could not find the page you are looking for.<br/>
This may happen if you have entered site url incorrectly or this page doesn&#39;t exist anymore.</p>
<p>You can try searching page again or go back to home</p>
<form action='/search' id='searchform' method='get'>
<input id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}' onfocus='if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;;}' type='text' value='Search...'/>
<input id='searchsubmit' type='submit' value='Go'/>
</form><h6><a href="http://techtspot.blogspot.com"> Get More Gadget</a></h6>
</div>

<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);
</script> 

 Step 3: Go to Your Blogger Blog and Check it.

I hope you enjoy this post and the photos. 404 Error Page In Blogger