Membuat Unordered (bullet) Tampil Menarik

Macam-macam gaya tampilan blog mulai dari template, widget dan lain sebagainya. Tak terkecuali dengan yang satu ini.

Tampilan Unordered atau bisa juga disebut bullet, istilah untuk menyebut urutan point-point tertentu tanpa menggunakan angka dengan gaya yang unik. Kenapa dibilang unik? Ya karena tidak seperti biasanya. Wah ini juga biasa koq mas! Ya sudahlah anda yang menilai, kalo menurut sy mah unik aja pokoknya .

Tampilan bullet default:
. Tutorial Blogger
. Widget
. Internet
. Komputer

Tampilan bullet modifikasi:

• Tutorial Blogger
• Widget
• Internet
• Komputer

Jika tertarik membuatnya, simpan kode css ini di atas kode ]]></b:skin> setelah anda Loggin ke Blogger - Rancangan - Edit HTML:

.post-body ul,
.post-body ol{
  margin: 1em;
  padding-left: 1em;
}
.post-footer ul{
  margin: 1em;
  margin-top: -0.5em;
  padding-left: 1em;
}
.post-body ul li,
.post-footer ul li {
  list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE9sCUd4A1-ZR2R8zGVC8-gykiB8NTS34G5luRKLuW_iv295rnZihY5VXauqE9sDsXo0_D4CJ-2Tgnr-3-6HfvzhmiUY2ISms8Nr4p-VC5qEa7Kfrwaxg90b2yn-eX8dhyphenhyphen57PUGOqyb3k/s400/uncheck.gif);
  border-bottom: 1px solid #ccc;
  padding: .2em 0 .2em .5em;
}
.post-body ul li:hover,
.post-footer ul li:hover {
  cursor: pointer;
  list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLXtgHZIuBoQoWGpnRtQ2b3JtrK3Fp-E94GYQLrBGsSLH-y3xo_H-Ozs1hHcFCZbUKMXTLKYeSZInb-JtLNSs9lA67fV9spMRXwMbhRN74WPsszbhtTnn1ITTgebJxWf2mNgn1h8IGZok/s400/check.gif);
  background-color: #f2f2f2;
  color: #B1291F;
}

Jika sudah, silahkan simpan templatenya lalu tes di kotak posting Blogger anda. tq