Cara Letak dan Tukar Sidebar Border

Assalamualaikum dan Salam Sejahtera semua.

Mungkin dalam 2@3 hari nie Jamal tak dapat nak update dengan new entry sebab Jamal tengah sibuk mengedit balik post-post lama blog nie dengan memasang tag dan mengaplikasikan teknik mesra SEO. Korang bayangkan lah Jamal ade 154 post nak kena edit semua post tue. Memang kena saba la, nie pun masih ade lagi 50 entry belum siap edit lagi.

Jika sebelum nie Jamal ade share dengan korang semua tutorial macam mana nak tukar sidebar background colour. So malam nie Jamal nak share dengan korang berkenaan dengan cara-cara untuk mengubah dan meletakkan border untuk sidebar. Nanti jadi macam gambar kat bawah nie.

Steps :

• Pergi ke DASHBOARD > DESIGN > EDIT HTML

• Cari code dibawah nie dan untuk memudahkan pencarian, korang boleh tekan Ctrl + F dan paste coding ini untuk search ye.

]]></b:skin>

•  Bila dah jumpe code diatas nie, korang copy pulak code dibawah nie dan pastekan betul-betul diatas atau sebelum code step no 2 tadi.

.sidebar .widget {

background : transparent ;
border: 5px solid #000000;
margin:0 0 2em;
padding:10px 10px 10px 10px ;
}

• Explanation

1. 1. background : transparent ; = kalau nak letak warna selain transparent pun boleh. Gantikan ayat transparent tue dengan kod warna mcm nie.. #000000 (pilih kod warna yang korang suka)

   1. border: 5px solid #000000; = nilai 5px ialah ketebalan border. Korang boleh jugak tukar..solid = boleh tukar ke dashed @ dotted. Kod warnapun boleh tukar jugak ye.
   2. margin:0 0 2em; = Yang nie jarak antara setiap gadget di sidebar. Kalau nak rapatkan tukar la kepada 1@0.
   3. padding:10px 10px 10px 10px ;
      = yang nie ialah jarak dalam kotak gadget tu pulak. Korang try la ubah tengok ape akan jadi. hehe.

• Step seterusnya korang kena buang border yang korang pakai sekarang nie. Cari coding kat bawah nie. Dan korang delete code yang warna merah tue ye.

.fauxcolumn-left-outer .fauxcolumn-inner {

 border-left: 1px solid $(body.rule.color);

}

• Bila dah siap, korang tekan button preview dulu tengok ada error ke tak ye. Kalau nampak semua ok, baru save. Dan dah siap.

Selamat mencuba, Gud Luck kawan-kawan

"Sharing Is Caring"