Mengatur Style Bullet Unorderer List (UL)
Bullet biasa digunakan untuk menjelaskan informasi yang berbutir. Biasanya bullet ini berbentuk bulat. Namun, anda bisa mengubahnya menjadi gambar seperti gambar dibawah.
Pertama-tama, bikin dulu gambarnya. Tak perlu besar-besar karena gambarnya adalah gambar untuk daftar berbutir (bullet). Sekitar 20 piksel x 20 piksel saja cukup. Kalau sudah, upload gambar tersebut ke image hosting. Lalu, kita mulai tutorialnya.
Ayo kita mulai.
1. Kita login ke Blogger terlebih dahulu. Lalu, klik menu Tata Letak > Edit HTML.
2. Backup dulu template anda.
3. Cari kode:
5. Lalu klik tombol Simpan Template.
Akhir kata, semoga tutorial ini bermanfaat.
Pertama-tama, bikin dulu gambarnya. Tak perlu besar-besar karena gambarnya adalah gambar untuk daftar berbutir (bullet). Sekitar 20 piksel x 20 piksel saja cukup. Kalau sudah, upload gambar tersebut ke image hosting. Lalu, kita mulai tutorialnya.
Ayo kita mulai.
1. Kita login ke Blogger terlebih dahulu. Lalu, klik menu Tata Letak > Edit HTML.
2. Backup dulu template anda.
3. Cari kode:
]]></b:skin>4. Diatasnya, ketikkan kode berikut.
/* Unordered list style */Ganti tulisan URLGAMBARANDA dengan URL alamat gambar anda. Lalu, anda juga bisa mengatur paddingnya. Cukup ganti yang berwarna merah dengan jarak sela (padding) yang diinginkan supaya gambarnya klop dengan teksnya. Yang lainnya tidak perlu diganti.
.post ul{
list-style-type:none;
margin:10px 5px 10px 0px;
}
.post ul li{
background: url(URLGAMBARANDA)no-repeat;
padding:0px 0px 5px 25px;
}
5. Lalu klik tombol Simpan Template.
Akhir kata, semoga tutorial ini bermanfaat.
PERTAMAX! aman!!!
BalasHapushehehe...
Assalamu'alaikum....infonya terimakasih..mas
BalasHapusAne aplikasikan ah......
wah makasih infonya sobat,,,,
BalasHapusmejeng yang keempatxx deh, hehe^^
BalasHapusbtw thanks atas ilmunya Mas Doy..
Sukses selalu dan salam blogger :D
mantepp nie infonya.... untunk ngeronda di temptnya mas doy...
BalasHapusuntuk ukuran apa harus 20 px nie.....?
setalah tidak terlalu sibuk di dunia offline,, langusng menyempat kan koment di tempat mas doyok,,
BalasHapuswah ketinggalan banyak artickle mas doyok nich...
di baca satu2 dulu mas
simpel tapi keren mas doyokk makasih triksnya mas doyk mau saya coba ni,,,
BalasHapustutorial yang sangat bermamfaat .. perlu dicoba nih
BalasHapusbravo mas
bagus juga tuh buat alternatif style dalam postingan blog, n gambarnya terserah kita ya mas? Tar mau nyoba ah, tapi gambarnya yang cocok apaan ya jadi bingung nih aku hehehe. Btw thank infonya mas
BalasHapussalam sahabat
BalasHapusouw bisa tah bagus infonya thnxs ya
keren nih... sudah saya coba.... mantaappppp
BalasHapusbermanfaat dan keren
BalasHapusterima kasih atas infonya,
BalasHapus@kecoak
BalasHapussipp
semoga bermanfaat ya :D
@rizki
BalasHapusheheh sippp :D
makasih postnya
@abu
BalasHapussemoga bermanfaat saja
ya
monggooo
@berita
BalasHapussemoga bener bener terpakai ya :D
@van
BalasHapusoke semoga bermanfaat ya
@seputar
BalasHapussipp
baiar lebih menarik :D
@dhana
BalasHapusiya silahkan dicoba
@andy
BalasHapusya gambarnya terserah kita :D
seusai keinginan kamu saja
@erge
BalasHapusmakasih kang
makasih kang rizki yg udah post ini :D
@dogan
BalasHapussilahkan langsung ke TKp saja :D
@ican
BalasHapusmonggo
semoga tetap terkejar ya :D
@tubir
BalasHapusgak mas
itu utk kerapian saja :D
@local
BalasHapussalam blogger juga mas
semoga bermanfaat ya :D
terima kasih
Lumayan nich, bisa di praktekkan di blog sy tercinta. Ijin baca ya!
BalasHapusINILAH 5 LANGKAH MUDAH MEMBUAT BLOG GRATISAN HOSTING SENDIRI
@yayan
BalasHapusmakasih banget mas :D
makasih banyak mas ....saya slalu ke sini mengadu masalah modifikasi blog...
BalasHapus