Read More,......
Kotak pencarian ini memiliki tampilan yang sangat simple atau sederhana mungkin
karena itulah sehingga banyak para blogger memasang kotak pencarian ini.
Jika ingin Anda ingin membuatnya, terlebih dahulu harus mempunyai menu bar,
jika belum ada silahkan bikin dulu ya….. atau Anda boleh juga membaca pada
artikel sebelum ini tentang Cara Membaut Menu Bar di Blogspot.
Berikut urutan untuk membuatnya :
1. Login ke Blog > Layout (template) >> Edit HTML >>> Cari kode ]]></b:skin>
2. Lalu masukan kode ini tepat di atas kode ]]></b:skin>
#navright {
width: 220px;
background: #FF1202;
font-size: 11px;
float: right;
padding-top:0px;
margin: -4px;
}
3. Lalu klik Save
4. Setelah itu buka widget menu bar milik Anda dan lalu masukan kode di bawah ini sebelum kode </ul></div> :
<div id='navright'> <form action='/search'
id='searchthis' method='get' style='display:inline;'><input
id='search-box' name='q' size='25' type='text' value='Cari Artikel
Disini'/><input id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtE7zk_ngyxJVIZ-7dgV-k-g9N1HD2hTBnkBCMgw_QnIOR6rfQUGNv_5ZW6IjtA49bActILyaXvDTbE5dOvdo0RrMHOjcmSZyrmtxa4yVhhpbNJ345rD4C72KJ-MmvHNQw8CbPXn4P6sM/s1600/magnifier.png'
style='margin-left: 5px; margin: 1px 15px 0px 13px;' type='image'
value='Search'/></form> </div>
Maka akan seperti ini, jika Anda sudah memasukan kode
diatas :
Contoh ini milik blog ini.
<div id='menubar'>
<ul>
<li><a
href='http://multiblog137.blogspot.com'>Home</a></li>
<li><a
href='http://multiblog137.blogspot.com/search/label/bisnis online'>Bisnis
Online</a></li>
<li><a
href='http://multiblog137.blogspot.com/search/label/blog'>Blog</a></li>
<li><a
href='http://multiblog137.blogspot.com/search/label/tutorial'>Tutorial</a></li>
<li><a
href='http://multiblog137.blogspot.com/search/label/daftar isi'>Daftar
Isi</a></li>
<li><a
href='https://plus.google.com/102701880217391607134'>About
Me</a></li>
<div id='navright'> <form action='/search'
id='searchthis' method='get' style='display:inline;'><input
id='search-box' name='q' size='50' type='text'
value='Search.......'/><input id='search-btn'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtE7zk_ngyxJVIZ-7dgV-k-g9N1HD2hTBnkBCMgw_QnIOR6rfQUGNv_5ZW6IjtA49bActILyaXvDTbE5dOvdo0RrMHOjcmSZyrmtxa4yVhhpbNJ345rD4C72KJ-MmvHNQw8CbPXn4P6sM/s1600/magnifier.png'
style='margin-left: 10px; margin: 1px 20px 13px 13px;' type='image'
value='Search'/></form> </div>
</ul>
</div>
Setelah itu Anda klik SAVE, dan selsesai. Silahkan Anda
lihat hasilnya di tampilan blog Anda.
Cukup mudah bukan…???. Semoga bermanfaat,…..
Salam,……
No comments:
Post a Comment