How To setup Custom Page Not Found in Blogger

Create A Custom 404 page Professionally

Custom Error Page Is Used When a Page is Not Found For Your Blog.

Then Create Your Professional Custom 404 Error Page For your Blog
Let's Start

Goto Your Blog Setting
Enable Your Option.Then Enter Code List Below.


<p style=’line-height: 30px’><strong>
<font color=’#ff0000′ size=’5′>
Oops!
</font> <font color=’#666666′>
Page Not Found <br/> Kindly do one of the followings to go to the correct location of this blog :D :
</font></strong></p>
<ol style=’line-height: 25px’>
<li><a href=’javascript:history.go(-1)’>&#171; Go Back</a> </li>
<li>Report the Problem to us by <a href=’ENTER YOUR CONTACT PAGE URL HERE‘>Contacting Us Here</a>&#160;&#160;&#160; (<em>This will help us to serve you even better</em>) </li>
<li>Go To Homepage by <a href=’HOMEPAGE URL HERE‘>Clicking Here</a>
<br/></li>
<li>Search Anything Using Below Search Box</li>
</ol>
<br />
<center><form _lpchecked=’1′ action=’/search’ class=’search-form’ id=’search_mini_form’ method=’get’>
<input id=’searchinput’ name=’q’ onblur=’if (this.value == &apos;&apos;) {this.value = &apos;Type Here & Hit Enter&apos;;}’ onfocus=’if (this.value == &apos;Search the site&apos;) {this.value = &apos;&apos;;}’ type=’text’ value=’Type Here & Hit Enter’/>
<input id=’searchbutton’ style=’vertical-align: top;’ type=’submit’ value=’Search!’/>
</form></center>
<p>
<br/>
<br/>
<br/></p>
<p align=’center’><font size=’5′>Page Not Found!</font></p>
<br /> <br /> <br />
<p align=’center’> <font style=’font-size:150px; font-weight:bold;’ color=’red’> 404 </font></p>
<style>
.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;
}
#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer , #rsidebar-wrapper { display:none !important;} #main-wrapper { width:98%!important;} .post { width:98%!important; }
#searchinput {

background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS3LHIfcmMupnDekyTw5P2Taxy6A9rRNd6La9cyVx9DvVdREQ2C4WNYhBK5WY-djrZVvCwnd8Pw9BvGKGZeRiR6sS_pU5sv7_haJ_9mf-4TX-DIfuYAb28KQvqDx82mXVIPrK_266w2Lrd/s0/search.png) no-repeat 7px 8px;
background-color: #FFF;
border: 1px solid #ddd;
color: #A0A0A0;
display: inline-block;
font-family:arial;
font-size: 12px;
font-weight:bold;
height: 24px;
width:300px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}
#searchinput:hover{
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);
padding: 5px 15px 5px 28px;
}
#searchbutton {
background:#444;
color:#fff;
height:35px;
border-radius:5px 5px 5px 5px;
box-shadow:1px 2px 1px 1px #ABABAB;
border:1px solid #fff;
margin-top:3px;
padding:8px;
}
#searchbutton:hover{background:#555;}
</style>




Replace Your Contact Page URL And Home Page URL

Then Click Save Changes.