How to create custom professional 404 eor for blogger 2017
To create a professional custom 404 eror for blogger
Follow the following steps
1 go to bloger setting
2 search prefences
3 custom 404 eror
4 Edit than click on yes than a box will apear
Than copy the following html and paste on the box
<!– GlobalCraze 404 Page –>
<p style=’line-height: 30px’><strong>
<font color=’#ff0000′ size=’5′>
Oops!
</font> <font color=’#666666′>
It seems that you have accidentally landed on this page which does not exists because you may have either clicked on a broken link or entered the wrong URL in the address bar. Right 😀 ??? <br/> Kindly do one of the followings to go to the correct location of this blog 😀 :
</font></strong></p>
<ol style=’line-height: 25px’>
<li><a href=’javascript:history.go(-1)’>« Go Back</a> </li>
<li>Report the Problem to us by <a href=’ENTER YOUR CONTACT PAGE URL HERE‘>Contacting Us Here</a>    (<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 == '') {this.value = 'Type Here & Hit Enter';}’ onfocus=’if (this.value == 'Search the site') {this.value = '';}’ 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/AVvXsEhUYe_yKEtJfMmdDlxT3UtiMn2YfSE3iqqUsGVxbdRdcfxJdBbyU0N7rvMlGJp8XhrBKLwJ8MWFIBlL2prqNtM7T2rkui3GpYmCIrx2bo6q-wPQLhXQiIc4Ki18wBW7aU_-V0A9K-1WvjbJ/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>
3. Replace ” ENTER YOUR CONTACT PAGE URL HERE ” with your blog’s contact page link.
4. Replace ” HOMEPAGE URL HERE ” with your blog’s homepage link.
5. Click on SAVE CHANGES & You are Done. 😀
Final Words…
This was the complete tutorial to Create Professional Custom 404 Error Page for Blogger Blog. Now after following the above steps, you can easily create your custom 404 page for blogger. If you wants to check that how your custom 404 page looks then simply enter any wrong URL in the address bar like http://www.yourblog.com/404 etc & you will see your hard work there. 😀 I’ll be thankful to you If you can subscribe to this blog to get the latest updates delivered to your mail box on the regular basis. THANKS FOR READING & HAPPY BLOGGING 😀
To create a professional custom 404 eror for blogger
Follow the following steps
1 go to bloger setting
2 search prefences
3 custom 404 eror
4 Edit than click on yes than a box will apear
Than copy the following html and paste on the box
<!– GlobalCraze 404 Page –>
<p style=’line-height: 30px’><strong>
<font color=’#ff0000′ size=’5′>
Oops!
</font> <font color=’#666666′>
It seems that you have accidentally landed on this page which does not exists because you may have either clicked on a broken link or entered the wrong URL in the address bar. Right 😀 ??? <br/> Kindly do one of the followings to go to the correct location of this blog 😀 :
</font></strong></p>
<ol style=’line-height: 25px’>
<li><a href=’javascript:history.go(-1)’>« Go Back</a> </li>
<li>Report the Problem to us by <a href=’ENTER YOUR CONTACT PAGE URL HERE‘>Contacting Us Here</a>    (<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 == '') {this.value = 'Type Here & Hit Enter';}’ onfocus=’if (this.value == 'Search the site') {this.value = '';}’ 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/AVvXsEhUYe_yKEtJfMmdDlxT3UtiMn2YfSE3iqqUsGVxbdRdcfxJdBbyU0N7rvMlGJp8XhrBKLwJ8MWFIBlL2prqNtM7T2rkui3GpYmCIrx2bo6q-wPQLhXQiIc4Ki18wBW7aU_-V0A9K-1WvjbJ/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>
3. Replace ” ENTER YOUR CONTACT PAGE URL HERE ” with your blog’s contact page link.
4. Replace ” HOMEPAGE URL HERE ” with your blog’s homepage link.
5. Click on SAVE CHANGES & You are Done. 😀
Final Words…
This was the complete tutorial to Create Professional Custom 404 Error Page for Blogger Blog. Now after following the above steps, you can easily create your custom 404 page for blogger. If you wants to check that how your custom 404 page looks then simply enter any wrong URL in the address bar like http://www.yourblog.com/404 etc & you will see your hard work there. 😀 I’ll be thankful to you If you can subscribe to this blog to get the latest updates delivered to your mail box on the regular basis. THANKS FOR READING & HAPPY BLOGGING 😀
EmoticonEmoticon