Syaz Harzays Minme: Tutorial : Sidebar Like Blogskin

Pages

STATUS UPDATED!
Assalamualaikum korang korang and korang... terima kasih kerana sudi singgah kat blog syaz ni.. hihihihi...

16 Feb 2014

Tutorial : Sidebar Like Blogskin

Assalamualaikum you all..
tengahari... dah makan takk?? kalau belum.. pergi la makan dulu...
hihhi... tengahari camni syaz buat tutorial?? hihihi.. yelaa... tutorial ni permintaan daripada sum1...
tak buat nanti takut org menunggu.. kesian pulak.. niat syaz nak membantu.. tu yang syaz buatkan ni... syaz nak bantu kawan2 bloggers yang memerlukan bantuan .. walaupun syaz ni tak la pandai sangat nak bertutorial... tak salah kan kalau kita sharing apa yang kita tahu... :)

oke2.. tutorial ni request daripada Cik Biela Naat kita ni.. biela folow je tuto ni k.. hope tuto yang syaz buat ni macam yang biela harapkan.. kalau tak.. biela bgtau oke... :)


1. Dashboard --> Template --> Edit Html

2. Tekan F3, then cari kod yang dekat bawah ni :

</style>

jumpa tak?? kalau tak jumpa cari kod yang bawah ni pulak :

</b:skin> 

hope jumpa la erkkk...


3. COPY kod yang dekat bawah ni pulak :

/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
background: #993399;
background-repeat:no-repeat;
font-size:14px;
font-family: kristen itc;
letter-spacing:2px;
color: #000000;
line-height:1.9em;
text-align:center;
padding-bottom:10px;
padding-top:10px;
padding-left:10px;
padding-right:10px;
margin: 10px;
border-radius : 10px;
border : 3px dotted #000000;
}
.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
.sidebar li {
margin: 0px;
padding-top: 0;
padding-right: 0;
padding-bottom: 1.5em;
line-height: 1.5em;
}
.sidebar {
color: #000000;
line-height:1.3em;
}
.sidebar .widget {
background:url(http://i.imgur.com/LJutz6p.png);
border-radius:15px 0px 15px 0px;
border-top: 3px solid #5a1663;
border-bottom: 3px solid #5a1663;
border-left: 3px solid #5a1663;
border-right: 3px solid #5a1663;
padding-top:20px;
width :310px;
font-family: short stack;
font-size: 12px;
-webkit-transition-duration: 1s;
margin:15px;
padding: 0px;
}

4. Dah copy?? kalau dah... boleh PASTE dekat atas kod yang korang cari tadi... dekat atas oke.. jangan salah.. hihhi

5. PREVIEW dulu... kalau nampak oke.. boleh SAVE... kalau berjaya tu... tepuk tangannn.. hihihi


p/s:
-korang boleh ubah warna tulisan , background n so on ikut suka korang la erkk... :)


SELAMAT MENCUBA ^^
kalau masih jugak tak faham n tak dapt buat.. bgtau syaz ... thanks yaa... :)

2 comments:

  1. wahh...nice tuto... nnt blh lar minta tlg if ada yg MB xpaam kn? hehee

    ReplyDelete
    Replies
    1. hahaha.. thanks akak... bolehh jaa... nanti syaz bantu.. hahahahah :D

      Delete

Assalamualaikum...
alang-alang dah baca tu..
mintak tolong komen sekali boleh??
hehehehe ^^

Syaz Harzays Minme© . Designed by MaiGraphicDesign