Langsung ke konten utama

Widget Form Search Engine for Blogger

Dalam sebuah blog/web tentunya hampir 99% pasti akan menyertakan sebuah kotak pencarian untuk memudahkan pengunjung dalam mencari sesuatu, namun tidak sedikti juga yang tidak menyertakan kotak pencarian karena beberapa alasan, mungkin alasannya adalah sebagai berikut :

  1. Sudah menyediak halaman sitemap jadi tidak memerlukan search form.
  2. Loading blog berat.
  3. Berpikir bahwa pengunjung tidak akan menggunakan search form pada blognya.
Namun bagi anda yang ingin menyediakan kotak pencarian pada blog anda sebagai fitur tambahan bagi para pengunjung blog anda, anda dapat dengan mudah menambahkannya dengan menuju Tata Letak > Add New Gadget > Search Form, atau dengan membuat sebuah widget pencarian sendiri.


Dibawah ini ada satu kotak pencarian yang mungkin bisa anda gunakan pada blog anda.
Pertama silahkan login akun blogger anda, dan silahkan menuju template kemudian silahkan cari kode ]]></b:skin> kemudian letakkan kode dibawah ini sebelum (di atas) kode ]]></b:skin>
.searchform {background: url(https://lh5.googleusercontent.com/-tihBRy5ftiI/UmLOuzEDBxI/AAAAAAAAAJA/pIheWO76kXw/s550/jurucoding-search.png) no-repeat; width:550px;height:47px; display: inline-block;zoom: 1; /* ie7 hack for display:inline-block */ *display: inline;border: solid 0px #ccc;padding: 0px;} .searchform input {font: normal 12px Arial, Helvetica, sans-serif;padding:6px;} .searchform .searchfield {background: #e5e5e5;width: 416px;outline: none;margin:5px 2px 0px 5px;;border-top:1px solid #888;border-left:1px solid #888;border-right:1px solid #ccc;border-bottom:1px solid #ccc;} .searchform .searchbutton {background: url(https://lh5.googleusercontent.com/-xqhs_7_uXsk/UmLPC693lmI/AAAAAAAAAJI/8HCsux2HrXc/h96/jurucoding-button-search.jpg) no-repeat;height: 28px; width: 104px;border:none;}
Kemudian simpan Template anda.
Selanjutnya silahkan menuju Tata Letak,  dan tambahkan gadget baru, pilih HTML/JavaScript, kemudian letakkan kode berikut :
<form action=' /search' class='searchform' method='get'>
<input class='searchfield' id='q' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;&quot;;}' onfocus='if (this.value == &quot;&quot;) {this.value = &quot;&quot;}' type='text' value=''/>
<input class='searchbutton' type='submit' value=''/>
</form>
Selanjutnya simpan dan lihat hasilnya.
Bagaimana? Mudah bukan?

Komentar

Postingan populer dari blog ini

Game Suit Dengan Java

Anda tentu sudah tidak asing lagi dengan permainan batu gunting kertas, permainan yang tentu sudah dikenal sejak masih kecil (katakanlah saat masih di bangku SD). Begitu juga game Suit ini yang mengadopsi dari permainan batu gunting kertas, sehingga tidak perlu dijelaskan lagi cara mainnya. Game ini hanya sebagai contoh game sederhana yang dapat anda kembangkan sendiri sesuai dengan imajinasi dan kemampuan anda. Atau, paling tidak game ini dapat anda gunakan untuk mempercepat kebosanan. Untuk memainkannya, anda membutuhkan Netbeans. Silahkan download dari situs resminya, untuk pengguna linux download netbeans.sh agar mudah instalasinya. Untuk menjalankannya, silahkan unrar suit.rar kemudian buka Netbeans, pilih file, open project, (cari dimana anda menyimpan file suit yang sudah di unrar kemudian klik pada file suit. Selanjutnya silahkan lihar pada bar kiri Netbeans, klik kanan pada suit kemudian pilih run dan Game siap dimainkan. Tampilan game ini sangat seder...

Membuat Login Form Dengan HTML dan CSS

Sebuah website tentu memiliki interface untuk client dan admin, dan untuk halaman admin tentu saja harus masuk terlebih dulu melalui halaman login. Bagaimana jika membuat halaman login form? Pada kesempatan ini atau tepatnya merupakan postingan pertama pada bulan desember 2013 ini Juru Coding  akan berbagi tutorial untuk membuat sebuah halaman login sederhana menggunakan HTML dan CSS. Untuk membuat halaman login form anda dapat mengunduh source lengkapnya melalui halaman ini, karena pada halaman ini hanya sebagai introduce saja dan untuk selebihnya silahkan dipelajari sendiri. Berikut screenshotnya : Index.html <!DOCTYPE html> <html lang="en"> <head>   <meta charset="utf-8">   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">   <title>Login Form</title>   <link rel="stylesheet" href="css/style.css"> </head> <body>   <section class...

Cara Bypass Shorten Link

Beberapa waktu yang lalu saya sudah berbagi cara bypass adf.ly  dengan memanfaatkan situs bypasser, pada kesempatan kali ini saya kembali akan berbagi cara untuk bypass adf.ly, maaf maksud saya shorten link karena yang di bypass bukan cuma adf.ly melainkan adfoc.us, linkbucks dan lain-lain. Caranya cukup mudah, cukup buka browser anda (Chrome / Firefox), kemudian cari ekstensi Tampermonkey (chrome), Greasemonkey (firefox). kemudian setelah instalasi selesai, lanjutkan dengan menginstall script-nya. Atau, anda juga dapat menggunakan cara dibawah ini. Chrome Install Tampermonkey Install Script Firefox Install Greasemonkey Install Script Kemudian selanjutnya silahkan dicoba, dan jika tidak bekerja maka silahkan restart browser, dan jika masih tidak bekerja juga maka remove terlebih dulu Tampermonkey/Greasemonkey kemudian ikuti cara dibawah ini Install Tampermonkey/Greasemonkey Restart browser Install script Dan jika dengan cara diatas masi...