Mempercantik Tampilan Widget Blog


mempercantik widget blog

Pada tulisan kali ini saya akan membuat tampilan widget pada Blog anda menjadi sedikit menarik. yaa, berhubung saya lagi males untuk basa-basi, jadi langsung aja dah. ikuti langkah-langkah dibawah :p
  • Login ke akun Blog masing-masing.
  • Pilih menu "Template".
  • Klik "Edit HTML".
  • Centang "Expand Template Widget".
  • Cari kode ]]></b:skin> (gunakan CTRL+F untuk mempermudah pencarian).
  • Jika sudah ketemu, copy kode dibawah ini, kemudian letakkan sebelum/diatas kode ]]></b:skin>
.main-inner .sidebar .widget h2 {   background: #FFFFFF;   background: linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   background: -webkit-linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   background: -moz-linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   background: -o-linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   background: -ms-linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   background: linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   -svg-background: linear-gradient(top, #E5E5E5 0, #FFFFFF 15%, #EBEBEB 50%, #CFCFCF 50%, #E0E0E0 100%) no-repeat;   padding:6px 3px;   margin:0 auto 10px;   text-align:center;}.main-inner .sidebar .widget-content {  margin: 0px;  text-align: justify;  text-decoration: none;  border: 1px solid #674ea7;  border-radius: 4px;  box-shadow: 1px 1px 6px 1px #3d85c6;  background: #ffffff;}.main-inner .widget #ArchiveList {  margin: 0px;}.main-inner .widget ul,.main-inner .widget li,.main-inner .widget ul li,.main-inner .widget #ArchiveList ul.flat li {  margin: 0px;  padding: 2px;  list-style: none;}
  • Jika sudah, klik "Simpan template".
Sekarang lihat hasilnya.

Terima kasih untuk kunjungannya.

1 comment:

  1. suwon gan kunjungan balik
    ??

    http://fotografipon.blogspot.com/

    ReplyDelete