Membuat Kotak pencarian cantik di blogger
Kali ini saya akan coba membagikan script code untuk membuat search box atau kotak pencarian untuk blogger. Kotak pencarian ini kalau dilihat seperti kotak pencarian Evomagz template yang cantikk dan kelihatan nya Responsive seperti gambar dibawah ini
Lihat seperti gambar dibawah ini
Copy paste script diatas tadi paste di halaman template tepat diatas ]]></b:skin>
Kemudian + Add a Gadget (no2) kemudian pilih </>htlm/javascript (no3)
Kemudian copy paste scrip dibawah ini
Selesai anda sudah bisa membuat kotak pencarian / search box di blogger. terimakasih semoga bermanfaat
Cara membuat search box unik blogger
Login ke blogger dashboard anda Kemudia langsung pilih ke theme editor dan pilih html
Copy Javascript dibawah ini dan paste di dalam template yang edit html tadi tepat diatas ]]></b:skin>
/* SEARCH BOX adstrikslink */
#searchbox-wrap {
margin:21px 20px 20px 0;
overflow:hidden;
}
#searchthis {
position:relative;
margin:0 0 0 0;
}
#search-btn {
position:absolute;
right:10px;
top:10px;
transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;
height:30px;
line-height:30px;
background:#07ACEC;
color:#fff;
padding:0 10px;
border:0 none;
font-weight:bold;
}
#search-btn:hover {
cursor:pointer;
background:#333;
}
#search-box {
transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;
height:40px;
line-height:40px;
display:block;
float:left;
background:#fff;
padding:0 100px 0 10px;
border:5px solid #EDEFF1;
width:180px;
}
#search-box:focus, #search-box:hover {
outline:none;
border:5px solid #07ACEC;
}
Copy paste script diatas tadi paste di halaman template tepat diatas ]]></b:skin>
Kemudian + Add a Gadget (no2) kemudian pilih </>htlm/javascript (no3)
Kemudian copy paste scrip dibawah ini
<div id='searchbox-wrap'>Paste di dalam Kotak Content (no4) dan SAVE (no5)
<form action='/search' id='searchthis' method='get'>
<input id='search-box' name='q' placeholder=' Search Template ' size='40' type='text'/>
<input id='search-btn' type='submit' value='Search'/>
</form>
</div>
Selesai anda sudah bisa membuat kotak pencarian / search box di blogger. terimakasih semoga bermanfaat
Post a Comment for "Membuat Kotak pencarian cantik di blogger"