Okay kali ini M'Rie nak kongsikan dengan anda. Bagaimana nak mengubah rupa template D.I.Y Theme : Thesis For Blogspot yang dihasilkan oleh Bro Shah Danial. Kali ini kita akan belajar macam mana nak mengubah bahagian Tittle Sidebar. Okay kita teruskan dengan tutornya.
1. Sila cari code CSS
Perkara pertama yang perlu anda buat adalah anda perlu Log In ke dashboard blog anda. Pilih Template > Edit HTML > Proceed.
Selepas itu sila cari code .sidebar h2 dengan menggunakan "Ctrl + F" di keyboard anda. Anda akan jumpa code sama seperti di bawah ini. Kalau tak sama pun, may be lebih kurang cam tu ar. Bergantung kepada template yang u all gunakan.
.sidebar h2 { #fff;border-bottom:3px solid $bordercolor;
margin:0em 0 0em;
font:Segoe UI, Serif;
line-height: 1.5em;
letter-spacing:.1em;
color:#669933;
font-size:130%;
margin-top:10px;
margin-bottom:4px;
}
2. Arahan Untuk Customize
Okay, kalau anda nak mudah. Anda cuma perlu gantikan code di atas dengan code yang dibawah ini sahaja. Sebab ianya lebih mudah, senang, cepat, dan pantas.
Version 1
.sidebar h2 { #fff;border:3px solid #ddd;
margin:0em 0 0em;
font:Segoe UI, Serif;
line-height: 1.5em;
letter-spacing:.1em;
color:#ffffff;
font-size:130%;
margin-top:10px;
margin-bottom:4px;
text-align:center;
background:#000000;
}
- Code warna yang berwarna merah tu adalah code warna bagi border. Itu adalah warna kelabu. Anda boleh tukar dengan code warna lain. Sila rujuk di sini.
- Code warna yang berwarna biru tu pula adalah code warna untuk font title sidebar. Code diatas adalah berwarna Putih. Sama seperti di point nombor 1. Anda boleh tukar dengan code warna lain mengikut kesesuaian warna latar yang anda pilih.
- Code warna yang berwarna hijau itu pula adalah code warna untuk latar title sidebar. Dalam code berkenaan ianya adalah berwarna hitam. Sila rujuk point nombor 1 untuk tukar code warna.
Version 2
Okay, version 2 ni yang membezakannya dengan version 1 adalah dari segi background sahaja. Di mana kita boleh membuat backgroundnya seperti dari warna cerah kepada warna gelap. Kiranya kita bermain dengan tone warna di sini. Code sama seperti di atas. Cuma ada pertukaran code pada code background sahaja.
.sidebar h2 { #fff;border:3px solid #ddd;
margin:0em 0 0em;
font:Segoe UI, Serif;
line-height: 1.5em;
letter-spacing:.1em;
color:#ffffff;
font-size:130%;
margin-top:10px;
margin-bottom:4px;
text-align:center;
background-image:-moz-linear-gradient(top,#E600E6,#800080);
background-image:-webkit-gradient(linear,0% 0%,0% 100%, from(#E600E6), to(#800080), color-stop(1,#800080));
background-image:-webkit-gradient(linear,0% 0%,0% 100%, from(#E600E6), to(#800080), color-stop(1,#800080));
}
- Code warna yang berwarna merah tu adalah code warna bagi border. Itu adalah warna kelabu. Anda boleh tukar dengan code warna lain. Sila rujuk di sini.
- Code warna yang berwarna biru tu pula adalah code warna untuk font title sidebar. Code diatas adalah berwarna Putih. Sama seperti di point nombor 1. Anda boleh tukar dengan code warna lain mengikut kesesuaian warna latar yang anda pilih.
- Code warna yang berwarna hijau & pink itu pula adalah code warna untuk latar title sidebar. Dalam code berkenaan ianya adalah berwarna pink. Sila rujuk point nombor 1 untuk tukar code warna. Yang berwarna hijau itu adalah warna pink cerah dan yang warna pink pula adalah warna pink gelap.
Okay, dah siap dah. Selamat mencubalah ya buat pengguna-pengguna template D.I.Y Theme: Thesis For Blogspot. Kalau ada apa-apa yang tak faham. Sila tinggalkan jejak di ruangan komen. Pastikan anda tidak buat spammed komen ya.
Post a Comment