Cara Mengganti Bullet List Di Blog

Posted by : Ariq Rastaman Minggu, 20 Oktober 2013

Cara Mengganti Bullet List Blogger

Sign In di blogger.com
Pada Menu drop down, pilih template
Klik tombol Costumize
Sobat blogger akan di bawa ke laman Blogger Template Designer
Klik Advanced dan pilih Add CSS

Bullet List.Bullet,Bullet Poit,cara memperindah blog,blog indah,blog cantik,cara mempercantik blog,Add CSS

Copy Paste kode berikut pada kolom yang tersedia

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiovt20rXA0r2jnKhr2-kq-kZMRz_uaiSBu9imNbED_r5ZiB3ElbTFreQrytTtwL06dTOpXweNsBUktdaeWWrBsFOXAoNN-01RNRWViHmn7q1jI4cuE3m7WLMGAdCy2tccfu8hM_H-KJw0/s400/255.gif');
}

Terakhir klik tombol Apply to Blog

Refresh atau Reload blog sobat blogger untuk melihat hasilnya. Kode CSS di atas akan menampilkan Bullet List seperti gambar yang ada dibawah ini:

Bullet List.Bullet,Bullet Poit,cara memperindah blog,blog indah,blog cantik,cara mempercantik blog

Kalau sobat blogger ingin tampilan yang berbeda, silahkan gunakan kode yang telah kami sediakan:

Bullet gambar panah

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUs6XGPYb3AZrLKbubSDOuK9nJen6dyzPjeW5QyAK60myIZPgotWmIxCWQNvh-hKIUWJDl54zaaUr8YTGClN0WwcsVn7ziWIJR1WiefBvXYYLZ4bGiB32HA6BXdn2mJXmi4eXmP7Bwt5rW/s1600/bullet_blue_arrow.png');
}

Bullet gambar Error

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfYyILxmiCC_9fyh8G2U4LuPbz32ysljvYUSTV2JKhHMver4PaZnUJ1PkP5iQDbWNv9X0aly4s6mEMmbfcIg3uYPEyVL4K0J0KiJcZ0Tzlj1LM14MXIftTOCnaKoISz4XB3kQMtxx72DHq/s1600/bullet_error.png');
}

Bullet gambar rumah

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-GB6ULGILalcS-4r-RuCAp9xkV7WPUEXcI8V8IzTEgCwkDECLkNilIfkL1EWDxzJRKSzNyPc5gpBl2nc-Vkqh4-EVG2Vwp_cptssEaOdyr58fniCcIHY8n0O7u5aJmZNdba8bGkVZq4I0/s1600/bullet_home.png');
}

Bullet gambar tanda centang

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi67l2HFpUx8euLELL4GWahoxPPCJllwr_PX7DAjl3DgOm1RETVGFVbEvcf_eNm4KZMhPyEokOlvXf7OmDymXqd3KALZVStEkvZrqnw2ygP6nO03q2fkoDX4zLFfnc-T2xXEzW36MQsvf0m/s1600/bullet_tick.png');
}

Bullet gambar bintang

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK_OInJOUECfiHF55cunKefVa9WEx83fsapsiz3U9yQLPmZOg82BKmkiXM-Irq69FDdDT65rrw0w4t6SD2A1ExUSbCtyOZOnuDzrDIEPNM5AiIjZHax2w_yCXM0rPd1iXs34xMHCVEsmI/s1600/star_bullet.png');
}

Bullet gambar cinta

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQZ4GwrynQ0gdd12nNwTcllM6vqd2LqpqgrOiDMEFb6-oz_lkUKjPtxrTaZqR4lIixSvtzUpTkYmkvCddPtZmJuufgLtBQ2GrLwBSlC-pLctDs4AJnSTCQeXujqDOYaPDJd5vIgPznEEA/s1600/Love+icon.png');
}

Bullet gambar plus

.post ul li {
list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ9Oq6QaaDRmeBi8gR1tmRWxsC8uTkjyaQszN8AGuXmKlnRPTSu99Oal0tpLyzMwzS-igglI5o985tIowQwyTykEZZVfruUtTyScLEo-KpQopcjiZXpWYzfg36MZrCNbGcvJCaWWfZHAg/s1600/Green+plus.png');
}

Punya ikon atau gambar sendiri? Pakai saja gambar sendiri untuk mengganti Bullet Point. Sobat blogger tinggal ganti yang warna merah dengan URL gambar sobat
Selamat mencoba

1 Comments

Tweets

Komentar

{ 1 komentar ... read them below or add one }

Ariq Rastaman20 Oktober 2013 pukul 01.46
:)
BalasHapus
Balasan

Tambahkan komentar

PERATURAN BERKOMENTAR DI BLOG OARU:

1. Gunakanlah bahasa yang sopan saat berkomentar.
2. Dilarang Memasang link hidup pada saat berkomentar.
3. Dilarang SPAM !!!
4. Untuk menyisipkan catatan, gunakan [catatan].. CATATAN KAMU ...[/catatan]
5. Untuk menyisipkan gambar, gunakan [img]URL GAMBAR KAMU[/img]