Tutorial : Letak Stylish Search Box

Assalamualaikum, Salam Sejahtera. :)
Bismillahirrahmanirrahim..

Benda ni memudahkan visitors blog anda untuk membuat sesuatu carian. Hanya menaip wordkey/kata kunci yang mereka nak, nanti insyaallah akan naik segala entry anda yang ada wordkey/kata kunci tersebut :)


TEMPLATE DESIGNER - denim, minima, simple template, Picture Window dan lain-lain
1. Sign in Blogger, Pergi ke bahagian Layout
2. Pilih Add a gadget (di sidebar atau ikut suka anda :b), ambil HTML/JavaScript.
3. Copy codes di bawah ni dan pastekan di ruangan tersebut.
4. Selepas dah habis edit, boleh SAVE :)

Classic template pula pandai-pandai sendiri eh cari codes sidebar anda sebab codes tak sama.

Ni yang simple punya :

<center><form action="/search" id="searchThis" method="get" style="display: inline;">
<input id="searchBox" name="q" onclick="this.value=''" style="width: 200px;" type="text" value="Nak Cari Apa?" /><input id="searchButton" type="submit" value="Search!" /></center>

• 200 ni boleh ubah kepada kelebaran tempat yang anda nak letak. Boleh adjust sendiri ya :)
• Nak Cari Apa? dan Search! ni boleh ubah kepada perkataan anda sendiri ataupun biarkan saja :b

Kalau nak lagi nampak stylish, boleh cuba yang ni :

<center><form action="/search" id="searchThis" method="get" style="display: inline;">
<input id="searchBox" name="q" onclick="this.value=''" style="background: #FCB8D4; color: black; font-size: 13px; height: 17px; width: 150px;" type="text" value="Nak Cari Apa?" /><input id="searchButton" style="background: #FF8AB9; border-color: #000000; color: white;" type="submit" value="Search!" /></center>

• 150 ni boleh ubah kepada kelebaran tempat yang anda nak letak. Boleh adjust sendiri ya :)
• Nak Cari Apa? dan Search! ni boleh ubah kepada perkataan anda sendiri ataupun biarkan saja :b
• #FCB8D4 (background untuk "Nak Cari Apa?") dan #FF8AB9 (background untuk "Search!")boleh ubah code warna ni kepada warna yang anda inginkin. Boleh cari codes warna DI SINI.
• #000000 Ni adalah codes warna border unruk "Search!". Boleh ubah sendiri. Cari DI SINI.
• black dan white ni boleh ubah kepada codes warna anda sendiri. nanti gantikan kepada #CodesWarna. Contoh : #00000 dan akan jadi macam ni : color: #000000;. Boleh cari codes warna DI SINI.

Yang lain-lain boleh tukar sendiri ya :))

Untuk search box ni, anda tak boleh letak background bergambar ya. hanya boleh codes warna sahaja. Qihah dah try, tak boleh. hehe.. Good Luck!


Kalau tak paham boleh komen di post ni atau di tab Ask (ada di sidebar). SERTAKAN SEKALI URL BLOG ANDA YA.
Assalamualaikum

[NI ADALAH AUTOPOST. TUAN BLOG ADA DI ASRAMA, NANTI KALAU BALIK INSYAALLAH SEGALA KOMEN DAN PERTANYAAN AKAN DIJAWAB :) Terima kasih..]]