Monday, January 17, 2011

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

27 comments:

  1. Farah, i x dpt carik pun coding tu..
    so sad.. ='(

    ReplyDelete
  2. x dapat cari coding tu lah.. =(

    ReplyDelete
  3. @Mas

    Thank sebab memcuba tutorial saya :)
    Saya tengok templete awak..templete designer..selalunya templete ini memang tak sesuai dengan tutorial ni :)

    ReplyDelete
  4. sis...mcm mane nak centerkan tajuk post entry ye..harap dpt membantu

    ReplyDelete
  5. @cik najihah

    cuma tambah code ini
    text-align: center;

    di bawah coding bahagian post title je..cuma buat

    ReplyDelete
  6. cik farah.. xdapat caro coding tuu.. hope dapat membantu...=)

    ReplyDelete
  7. kenapa tak dpt crik code tuh ??

    ReplyDelete
  8. wahh dpt buat gak akhirnya .. pkai tuka sbrg jek code .. pdhl ta sme ..thnk cik farah

    ReplyDelete
  9. akak knape sye x jumpe code tu. . dh try dua2 :'( cian nyer sye

    ReplyDelete
  10. sis memang templae designer tak boleh guna eh?


    buat tuto ni unutk template designer lak boleh


    please please

    ReplyDelete
  11. kak farah, terimah kasih sangat2... sy dah dpt.. main hentam je.. agak2 je letak code tu... heheh tq

    ReplyDelete
  12. Tak jumpe la kod tu ..
    Camner ekk ?

    ReplyDelete
  13. sis farah..nak mintak tlg jap tgk jap blog sy cmner nak kasi xnampak sidebar bagi widget yang kita disable tu ea?pastu cmment kat chat sy ea..pleze..

    ReplyDelete
  14. @city_asthma

    Letak widget tu dibahagian bawah sekali..di footer :)

    ReplyDelete
  15. x pndi lg la nk pki ctr F tu..asyik naik merah je...sob2

    ReplyDelete
  16. Salam akak , boleh tak akak ajar sye mcm mne akak buat mcm sebelah kanan blog akak tu . Macam hot iklan ,kesayangan , shopping fever and lain2 tu . Pless :)

    ReplyDelete

-Assalamualaikum, sila tinggalkan komen anda.
-Kalau suka tekan LIKE.
-Insyaallah komen anda akan dilayan :)

Terima kasih lepak sini, nanti datang lagi yer..
Sayang Korang...





Related Posts Plugin for WordPress, Blogger...
 
Copyright © 2016 Blog Cik Nurfarah. All Rights Reserved. Designed by Blog Cik Nurfarah.