Kotak pencarian merupakan sebuah tools yang dapat mempemudah pengunjung dalam menemukan artikel yang ingin di baca. Oleh karena itu, Tutorial blog ini adalah tentang cara membuat kotak pencarian pada blog. Kotak pencarian yang tampilan sangat simple atau sederhana. Mungkin karena memiliki tampilan yang sangat sederhana, sehingga banyak blog memasang kotak pencarian ini.
Berikut ini tampilan dan kode dari masing-masing kotak pencarian :
Kotak Pencarian 1
Kode Kotak pencarian 1
<form id="searchThis" action="/search" style="display:inline;" method="get"><input id="searchBox" name="q" type="text"/> <input id="searchButton" value="Click to go" type="submit"/></form>
Kotak Pencarian 2
Kode Kotak pencarian 2
<form id="searchthis" action="/search" style="display:inline;" method="get"><input id="search-box" name="q" size="25" type="text" style="background: #ffffff; border: 2px solid #cccccc"/><input id="search-btn" value="Search" type="submit" style="background: #cccccc; border: 2px outset #cccccc; color: #000000; font-weight: bold;"/></form>
Kotak Pencarian 3
Kode Kotak pencarian 3
<form id="searchthis" action="/search" style="display:inline;" method="get"><input id="search-box" name="q" size="25" type="text" value="Enter search query"/><input id="search-btn" value="Search" type="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4tMeN1_FADgSKaPNAbIcx-z-vZJEi-Ia8HERuDx2534AFOG_G1eH4_YN-GPoPZzCenaezt0h6pARDnddhf_fYljbpTCmwcD4K_tS7jzingslmR74mOZJ7zC5M0ObgWlCNDlZdkP8O9bc/s1600/magnifier.png" style="margin-left: 5px; margin: 3px 0 0 5px;"/></form>
Copy salah satu kode dari kotak pencarian tersebut, letakkan kotak pencarian tersebut di kolom widget/gadget.
No comments:
Post a Comment