2010-03-19

Mempercantik Page Statis Blogger

Sekedar Arsip #2 : Cara Merubah Tampilan Halaman Statis Blogger Dengan Kode CSS.

Blogger kini telah resmi menyediakan widget halaman statis ditemplatenya seperti tampilan menu navigasi (tapi bukan menu navigasi loh). Tampilan halaman statis (staticpage) bawaan blogger terlihat sederhana. Kita bisa memolesnya sedikit untuk mempercantik halaman statis ini dengan menggunakan kode css, contoh halaman statis ini bisa sobat lihat dipojok kanan atas template saya ini, awalnya saya mencoba merubah tampilannya dengan menggunaka add-on browser si rubah api yaitu Firebug yang telah saya jelaskan pada tulisan saya sebelumnya. Caranya mudah ikuti saja tips berikut ini :

Cari kode berikut ditemplate sobat :

]]></b:skin>

Jika sudah ketemu copas kode berikut dan letakkan diatas kode ]]></b:skin> tadi:


#PageList1 li {
  margin:1px;
  padding:2px 2px;
  float: left;     
  background-color: #FF8E43;
  border:1px solid #ffffff;
}
 
#PageList1 a {
  color: #ffffff;
  height:24px;
  text-decoration:none;
  padding:10px 12px 0;
}
#PageList1 a:hover {
  color: #FFFC17;
  text-decoration:none;
 }

.PageList li.selected a {
font-weight:normal;
text-decoration:none;
}

Pada tulisan cetak biru adalah warna background dan angka dihalaman statis, tinggal sobat ubah menyesuaikan pada template sendiri.
Ps: Foto Seksi Aura Kasih sengaja di pajang biar mata agak nyaman memandang setelah melihat kode css di atas. Jika ada kesalahan dalam penulisan dan penjelasan pada halaman statis ini saya mohon maaf dan mohon diberi menurut petunjuknya presiden. Trims.

12 comments:

  1. makin mantap saja kawan ku yang satu ini, makasih bro...langsung praktek sebelum basi...hee..hee...

    jangan lupa permintaan kemaren...xixix..ixixi

    ReplyDelete
  2. waduh kalo dah masuk ke template... dah nyerah bos diriku yang gaptek ini

    ReplyDelete
  3. ajarin dong bos... newbies nih

    ReplyDelete
  4. wah cocok nih sob buat aq yg suka ngutak ngatik css

    ReplyDelete
  5. Artikel yg cantik...se-cantik Aura Kasih....bohay n nyakdut mas....

    ReplyDelete
  6. wahh..kerennn..tapi saya lieur :-t
    salam knal mas

    ReplyDelete
  7. Rizal@sudh bro, mksh.:D
    Soewong@ah jgn merendah gitu donk master soewoeng.
    Koplak@iya boleh, saya jg newbie nh.
    Rizky@Iya mmng cocok, mksh sdh berkunjung.
    Om srex@aura kasih mmng bohay om, xixixi
    ususpanjang@salam kenal juga mas

    ReplyDelete
  8. makin cantik kalo ada foto luna maya :D

    ReplyDelete
  9. bro mohon petunjuk lagi ni, gimana bikin navigasi breadcrum, dan relate post, karena cari di google tapi setelah dicoba nggak berhasil..
    thank

    ReplyDelete
  10. Nyubi@iya luna maya memang lebih ok.
    Rizal@ ok yau, cb lihat di alamat ini
    http://tutorial-untuk.blogspot.com/2010/03/breadcrumbs.html

    ReplyDelete
  11. mantap mas.. saya coba dulu yaaa .. terima kasihh

    ReplyDelete
  12. siap bro...mantap artikelnya..thanks banget ya..
    http://www.wismilakayaya.blogspot.com

    ReplyDelete

 
© 2012 Planet Jingga. Natuna Network Natuna | Abrizal.