Advanced Search Box For 404 Page On Blogger

Share... ☂

Share on Facebook
Share on Twitter
Share on Google+
404 Page is just an error page on your website or blog and it is not good for you to have lots of error pages on your website or blog.
Few weeks back we talked on how to add the 404 page on your blog without much stress......
Today we want to give out this wonderful tips on how to serve your blog audience better and make them stay active on your blog using this advanced search box for 404 page on blogger.

Image



Step 1
You need to login to your blogger account and then click on the blog you want to work on.




Step 2
Now scroll your mouse down to the settings tab and just click in it


Step 3
On the settings drop down menu click on search and preference button



Step 4
Now after the meta tag description you will find the custom page not found just click on the edit button by the side.

Image





Step 5
Now copy this code below and paste it inside the box given to you and click on the save changes button below.





<style>
#search-button-links1 {
    position: relative;
    top: 0;
    right: 0;
    height: 60px;
    width: 580px;
    font-size: 18px;
    color: #000;
    text-align: center;
    text-decoration:none;
    line-height: 42px;
    border-width: 0;
    background-color: #5caddf;
margin:5px;
    cursor: pointer;
}
#search-box1 {
    position: relative;
    width: 100%;
    margin: 0;
}
#search-form1 {
    height: 40px;
    border: 1px solid #999;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    overflow: hidden;
}
#search-text1 {
    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-button1 {
    position: absolute;
    top: 0;
    right: 0;
    height: 42px;
    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-box1'>
  <form action='/search' id='search-form1' method='get' target='_top'>
    <input id='search-tex1t' name='q' placeholder='Search schoolans' type='text'/>
    <button id='search-button1' type='submit'><span>Search</span></button>
  </form>
</div>
<p style="color:#e33633; font-family:verdana, sans serif; font-size:16px; padding:24px; text-decoration:none">This Page has been removed for some reasons please | Visit <a href="http://schoolans.com">schoolans</a>

ARRANGEMENT
Change any coloured link or word to you preferred choice.




And that's all... Your blog visitors will use the search box as an advantage to search your blog content.
Share :

zealmatblog

No comments:

Post a Comment

Create your website from just N299/Month with DomainKing.NG.

P.S: Want me to help you personally? If yes, you can buy my helpful eBooks or Hire me now!

Do you need original SEO ready articles for your blog or website? If yes, hire Mathias Amodu on Fiverr. Expect simply the best from me.







Parse Your Adsense HTML code Here





We love to hear from you!

Sign in to comment "anonymously" without entering verification text.