Güncel Haberler, Yazılım, Teknoloji ve İnternet Paylaşım

Add New Adya 404 Error Page in your Blog

Add New Adya 404 (Error) Page Not Found



SCREEN SHOT




Hello Bloggers In this Post I am going to show you how you can set a custom 404 error page (Page not found) in your blog.Okay  here is a new  404 error page called Aday.This is a beautiful error page for bloggers and simple to add in your blog.What is 404 error? 404 error mean if u search any wrong URL of any blog or website or That files you want to see on blog or website is not available.then you can see a error page with some message like  this >(404 error page not found)

Click Here to watch Demo of 404 page  not found.

If you like this and want to add this in your blog then follow Below Steps. 

Step:- 1 Go to your blogger dashboard

Step:- 2 Then go to Setting > search preferences 

Step:- 3 Copy Below code and past is custom page-not found section

Like below image.



    



    <div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://www.99pcsoft.blogspot.in/" target="_blank"><img alt="HOME" border="0" src="http://4.bp.blogspot.com/-RlYNHBBouBI/U90YYBoe8nI/AAAAAAAAAnc/F7p42rTfiNo/s1600/output_HNanWY.gif" height="259" width="320" /></a></div>
<br />
<div style="text-align: center;">
<span style="font-family: showcard gothic,&quot;Times New Roman&quot;,serif;"><span style="font-size: small;">We are sorry but we could not find the page you are looking for.This may happen if you have entered site url incorrectly or this page doesn't exist anymore.You can try searching page again or go back to home</span></span>.</div>
<div style="text-align: center;">
<br /></div>
</div>
<style>
#search-box {
position: relative;
width: 30%;
margin: 0;
}

#search-form
{
height: 40px;
border: 1px solid #999;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
}
#search-text
{
font-size: 14px;
color: #ddd;
border-width: 0;
background: transparent;
}

#search-box input[type="text"]
{
width: 90%;
padding: 11px 0 12px 1em;
color: #333;
outline: none;
}

#search-button {
position: absolute;
top: 0;
right: 0;
height: 40px;
width: 80px;
font-size: 14px;
color: #fff;
text-align: center;
line-height: 42px;
border-width: 0;
background-color: #4d90fe;
-webkit-border-radius: 0px 5px 5px 0px;
-moz-border-radius: 0px 5px 5px 0px;
border-radius: 0px 5px 5px 0px;
cursor: pointer;
}
</style>

<div id='search-box'>
<form action='/search' id='search-form' method='get' target='_top'>
<input id='search-text' name='q' placeholder='Search Again' type='text'/>
<button id='search-button' type='submit'><span>Search</span></button>
</form>
</div>

IMPORTANT 

 :- Replace the red line (http://www.99pcsoft.blogspot.in/) with your blog home page URL 

:- U can also change the width of the search bar Blue line

:- U can edit text Green line

NOTE:-If u like this Post please give comments for your Feedback suggestion or Help thanks..!!

Yorumlarınız için teşkür ederim Conversion Conversion Emoticon Emoticon