Menu search apple untuk blog

Setelah memposting tentang lomba SEO, sekarang link manual akan menshare cara
membuat menu search di blog seperti apple, untuk lebih jelasnya silahkan simak artikel berikut ini :

Log in ke akun blogger kalian

Pada Dashboard pilih Design

Lalu pilih lagi Edit HTML

Cari code berikut ini

]]></b:skin>

Letakkan code dibawah ini tepat diatas code tersebut

#search {
}
#search input[type="text"] {
background: url(https://lh4.googleusercontent.com/-SBuAPGg_eJw/
Ts0EGS0F7lI/AAAAAAAAABQ/3gzoJ_ArAEs/s15/search-white.png)
no-repeat 10px 6px #fcfcfc;
border: 1px solid #d1d1d1;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #bebebe;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}
#search input[type="text"]:focus {
width: 200px;
}

Lalu Save templates

Pada Page Elements pilih Add a Gadget lalu HTML/Javascript

Lalu masukkan code berikut ini lalu save

</form>

Lihat hasilnya.....dan selamat mencoba