INFO TERKINI

Kali ini saya akan kembali memposting kembali dengan tema blogger tutorial . Sebenarnya ada satu lagi List yang dipakai untuk membuat sesuatu daftar kata  yaitu Number list . Number list dengan bullet list hampir sama cara memakainya , namun yang membedakan adalah jika number list menggunakan angka maka bullet list menggunakan sebuah tanda kecil . Dan pada artikel ini kita akan merubah tanda kecil itu menjadi sebuah gambar keren dan cantik dengan menggunakan sebuah kode css . Untuk membuat nya semakin mudah saya sudah menyiapkan beberapa gambar yang bisa anda langsung pakai namun tentu saja anda bisa mengganti gambarnya dengan gambar anda sendiri .Berikut ini saya sudah mempunyai demonya dari bullet list yang sudah diganti dengan gambar.



Mohon maaf jika demo bullet listnya hanya sedikit saya tampilkan. Nah , jika anda berminat anda bisa mengikuti langkah berikut ini.

• Menambahkan css untuk membuat Bullet List

1. Copy kode css dibawah ini melalui template designer dengan cara pergi ke akun blog anda lalu pilih design > template designer > advanced > add css.

• Cara memakai gambar bullet anda sendiri - Ganti tulisan " Url Gambar disini " dengan url gambar anda yang berukuran 12 x 12.

• Menggunakan gambar yang telah disiapkan - untuk gambar yang sudah saya persiapkan anda hanya perlu langsung saja memasukkan kode url gambarnya  langsung ke dalam tulisan berwarna kuning  diatas. lalu men copy paste ke dalam kotak css .

• Bullet Tic Hijau

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQnuyBi3EOASeXlffP-4K3-brXhJd5LFedPajWgMut9twOqMLiW6y33Vj7-37GuQvw5slMhkYran2-f6g7E__KK02MmESWg8goM1uuxxYjgGXTD1db1mS7U0kZhckZ3IHFJPEsO2dNszI/s800/bullet-point-green-tick.png

• Bullet Panah Merah

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHGcxfNNyO7Mgp0UnwwhsIsoh4zQxi_FAvmBJ8n2iPjg0WqC1HI-_UGC4CGRLHZUZkSq0cmr2dfTo4Ws5c6bxrFj5c3oN_toQP6SB0E8e6mP0Il1mMesA_ALYxpviRP-U6mYKN3QatERE/s800/bullet-point-image-1.png

• Bullet Bunga Tick Point

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVoCdG27L7scc1KMx_b2cdk5qYi7-a81EeEcZHKIyULd6qSgOFV26FMbBt4-1rso89VtJ98nKJA0WyP82HkpLeqFO3nXg4WIIaW1FqmahHgpm-fc1KN_2YOHafaU7K1jR6TU16vZkvSWE/s800/bullet-point-image-4.jpg

• Bullet Panah oranye dobel

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYXdVNjQ63-5VEPL9KuZgt1FEEt4gbyHyVhyQj15LpM8cutUAPTr8Dn_WB5iglwZoosC0nYB1voSCZeJYQfj-YsFxdSle4bVvM28SoygulaXADA2OCQB8vwrV5u-4ulN38GsEKZ4cbIds/s800/bullet-point-image-5.gif

• Bullet Diamond biru

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9TpjUvpXVKj9sQT1jpZHjZPJaTcMRoKPo1oM_z-jWr3zIfxjg4xzRrRdqLxj3anvISacjZqB4QglggDynvRJbe7Ls8AHmI2TV2bxwLET27QORhNEef3RVA8iOoYwvLXdro2l4qfzA08M/s800/bullet-point-image-8.png

• Bullet Panah Biru

 - kode = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxdEPZv2h4r0KxrTSOOetJ5o01VYr2hfElTsMocC8zydeN7oxVViAgjae-6A19x1n3SO9lGevDcUWlePIhnIbGLfou_xaJ6_kjz6wpZnku9_MUQpLQzSlENqBRRKQv64I9NtgU3Fw0mkk/s800/bullet_list_icon.jpg


Mungkin beberapa gambar bullet yang diatas anda bisa memakainya jika anda menginginkannya , untuk membuat gambar bullet itu muncul maka anda harus menambahkan kode css class="imglist" setelah kode <ul pada kode bullet list pada menu edit html di postingan, berikut ini saya akan memberikan sedikit contoh teksnya:

• <ul class="imglist">
  <li>Bullet List css</li>
  <li>List Bullet css</li>
  </ul>

Baiklah mungkin untuk pembahasan tentang tema blogger tutorial ini cukup sekian , mungkin jika ada kesulitan anda bisa bertanya dengan meninggalkan komentar pertanyaan anda dibawah ini .