Tutorial 38 : Membuat Divider di Sidebar

Salam.
Sorry sebab aku lambat nak post tutorial.
Sekarang ini mood untuk menulis tutorial yang di minta oleh reader sudah datang dengan mesranya.
Kali ini aku nak ajar macam mana nak buat sidebar macam reben pink kat sidebar aku tu...
Ok ikuti cara-cara ini


1. Sign in blogger > Design > Edit HTML
2. Cari code ini

.sidebar .widget { 

Tapi kalau tak dapat cari code di atas cari code ini je

.sidebar .widget, .main .widget {

Korang akan jumpa code macam ini :



.sidebar .widget {
  margin-bottom: 1em;
}


ATAU macam ini, mengikut coding yang cari tadi

.sidebar .widget, .main .widget {           
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
 }
3. Code yang aku merahkan itu, korang delete dan gantikan dengan code di bawah.

margin:0 0 1.5em;

padding:0 0 50px;

background-image: url(URL DIVIDER);

background-position: bottom;

background-repeat: no-repeat;

}

kalau code korang tak sama dengan code warna merah yang aku tanda tu, delete semua code tanda sampai ke } ( tanda  } delete sekali la )

4. Faham tak? bila dah ok, gantikan URL DIVIDER dengan url andalah! 

5. Preview dan SAVE.. sila bagitahu kalau tak jadi..dah jadi pun bagitahu juga..

 

p/s : Berbelit-belit sikit tutorial ini.. Sebab setiap coding templete berbeza..kalau coding nombor 2 tu korang tak dapat cari memang templete itu tak sesuai untuk tutorial ini...Tutorial ini hanya sesuai untuk Layout Templates (Launched 2006) seperti Minima, Denim dan lain-lain. Kalau templete designer tu korang test la sendiri kot boleh jadi..yang ambil kat web templete pun aku tak jamin boleh ke tak...

Sila-sila la LIKE

SHARE:

blog tutorial