Saturday, August 18, 2012

A beautiful search engine for your blog...


To make your blog beautiful and search into your own blog ,
I suggest you to keep this search engine code.


     Follow the steps:

         1. Log in to blogger
            go to  Dashboard >> layout >> add a gadget


       2. Now just copy the code given below and paste into "add a gadget" windows.


            



<style type="text/css"> 
#searchbox
   {
    background: #eaf8fc;
    background-image: -moz-linear-gradient(#fff, #d4e8ec);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop
(0, #d4e8ec),color-stop(1, #fff));
    -moz-border-radius: 35px;
    border-radius: 35px;
    border-width: 1px;
    border-style: solid;
    border-color: #c4d9df #a4c3ca #83afb7;           
    width: 270px;
    height: 35px;
    padding: 10px;
   
    overflow: hidden;
   }
#search, #submit
        {
            float: left;
        }
        #search
        {padding: 5px 9px;
            height: 23px;
            width: 180px;
            border: 1px solid #a4c3ca;
            font: normal 13px 'trebuchet MS', arial, helvetica;
            background: #f1f1f1;
           -moz-border-radius: 50px 3px 3px 50px;
             border-radius: 50px 3px 3px 50px; 
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) inset, 0 1px 0 rgba(255, 255, 255, 1);        }
  #submit
  {  background: #6cbb6b;
            background-image: -moz-linear-gradient(#95d788, #6cbb6b);
      background-image: -webkit-gradient(linear,left bottom,left top,color-stop
(0, #6cbb6b),color-stop(1, #95d788));
            -moz-border-radius: 3px 50px 50px 3px;
            border-radius: 3px 50px 50px 3px;
            border-width: 1px;
            border-style: solid;
            border-color: #7eba7c #578e57 #447d43;
     -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
     -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
       box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;    
   height: 35px;
   margin: 0 0 0 10px;
   padding: 0;
   width: 60px;
   cursor: pointer;
   font: bold 14px Arial, Helvetica;
   color: #23441e;
   text-shadow: 0 1px 0 rgba(255,255,255,0.5);
  }
  #submit:hover
  {         background: #95d788;
            background-image: -moz-linear-gradient(#6cbb6b, #95d788);
            background-image: -webkit-gradient(linear,left bottom,left top,color-stop
(0, #95d788),color-stop(1, #6cbb6b));
  }
#submit:active
  { 
            background: #95d788;
   outline: none;
           -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
             -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
             box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; 
  }
#submit::-moz-focus-inner
  {
    border: none;
  } 
 
#search::-webkit-input-placeholder {
           color: #9c9c9c;
           font-style: italic;
        }
        #search:-moz-placeholder {
           color: #9c9c9c;
           font-style: italic;
        }   
        #search.placeholder {
           color: #9c9c9c !important;
           font-style: italic;
        } 
        #search:focus
        {
            border-color: #8badb4;
            background: #fff;
            outline: none;
        }
</style>
<form id="searchbox" action="/search" method="get">
    <input id="search" name="q" type="text" placeholder="Type here" />
    <input id="submit" type="submit" value="Search" />
</form>




Now save it and move to the place you like.
 Enjoy it.

No comments:

Post a Comment