Selasa, 25 Januari 2011

Cara Merubah Style Label Dan blogroll Jadi 2 Kolom Pada Blogspot

Contoh daftar catagori 2 kolom
Sebelum kita praktek merubah style Label dan blogroll jadi dua kolom, Saya akan memberi sedikit penjelasan dari Blogroll karna kalau untuk label atau Catagory saya rasa bloger pemula pun sudah tau.
  • Apa yang di maksud dengan Blogroll? Blogroll ini seperti sebuah daftar link yang tersusun berurutkan dan biasanya di letakkan di bagian sidebar dan footer blog atau website.
  • Fungsi dari blogroll ini banyak sekali diantaranya bisa untuk promosi blog, memudahkan kunjungan ke blog teman, bisa meningkatkan trafik blog, bertukaran link dan bisa mempererat persahabatan sesama bloger.
Ok sekarang kita mulai:

  • Login dulu.
  • Menuju Dasbord.
  • Pilih Rancangan atau Desing.
Di bagian elmen laman cari judul dari widget catagori atau label dan blogrol yang nantinya akan kita gunakan untuk setting pada code css nya , 
Contoh seperti gambar di samping, Ingat! gambar ini cuman sekedar contoh. 
sekarang klik di bagian Edit HTML
jangan di centeng bagian Expand Template Widget
biar gak bingung nanti, Lalu cari judul dari catagori dan blogrol tadi , Untuk pencarian lebih mudah gunakan faslitas menu Fine atau tekan Ctrl+F, ketik salah satu judul widget tadi dan cari / enter.
jika sudah ketemu maka kode untuk catagorinya seperti ini
<b:widget id='Categories' locked='false' title='Categories' type='Label'/>
untuk blogroll seperti ini
<b:widget id='blogroll' locked='false' title='blogroll' type='LinkList'/>
setelah itu cari code ini (  ]]></b:skin>  ) cara mencarinya seperti tadi gunakan fasilitas menu fine
jika sudah ketemu copi paste code di bawah ini dan letakkan di atas code
]]></b:skin> .

#ketik judul widget catagori a, #ketik judul widget brogoll {color:#fff;}  yang ini untuk warna linknya
#ketik judul widget catagori ul li, #ketik judul widget brogoll {float:left; width:110px;font-size: 12px;} yang ini untuk mengatur kolom.

Ganti tulisan yang berwarna kuning di atas dengan judul widget
hasilnya seper ti ini
#Categories a, #blogroll a, {color:#fff;}
#Categories ul li, #blogroll ul li{float:left; width:110px;}


Untuk lebarnya bisa di sesuaika sendiri,
setelah itu simpan dan lihat hasilnya
Selamat mencoba Semoga bermanfaat.

 
Powered by Blogger