Cara merubah tampilan bullet list diposting blog menggunakan gambar. Bullet list atau tanda bulat-bulat yang ada diposting blog akan kita ganti dengan menggunakan gambar, agar terlihat lebih stylish. Contoh gambar lihat dibawah ini.
Bagaimana??anda tertarik untuk mengganti bullet list diblog anda dengan gambar. Jika tertarik, silakan ikuti langkah-langkah dibawah ini.
- Login ke blogger. Selanjutnya kepengaturan Tata Letak > Desainer Template > Tingkat Lanjut > Tambahkan Css.
- Lalu copi kode berikut dan pastekan kedalam kotak tambahkan Css.
- Selanjutnya Klik terapkan ke blog, selesai.
.post ul {
list-style:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjCzdPFjg152cEEM5vlQf5fPoG69NHal0oP7OkTLwBtNKtUv_FQCvux1BlK0vEo2lfsoV5Q-SzI-cJPkbd6sw6OgJEsKd1uqrT9TEcscr6wwbd5olp-yApIVHl2Rlge92vkCPEaJJ8xMe-/s12/bullet%2520list.gif);}
list-style:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjCzdPFjg152cEEM5vlQf5fPoG69NHal0oP7OkTLwBtNKtUv_FQCvux1BlK0vEo2lfsoV5Q-SzI-cJPkbd6sw6OgJEsKd1uqrT9TEcscr6wwbd5olp-yApIVHl2Rlge92vkCPEaJJ8xMe-/s12/bullet%2520list.gif);}
- .post ul { kode untuk mengatur bullet list diposting blog.
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjCzdPFjg152cEEM5vlQf5fPoG69NHal0oP7OkTLwBtNKtUv_FQCvux1BlK0vEo2lfsoV5Q-SzI-cJPkbd6sw6OgJEsKd1uqrT9TEcscr6wwbd5olp-yApIVHl2Rlge92vkCPEaJJ8xMe-/s12/bullet%2520list.gif merupakan kode url dari gambar yang akan dijadikan bullet list diposting blog.
Jika ingin menggunakan gambar sendiri, silakan buat gambar yang akan dijadikan bullet list diprogam gambar, buatlah gambar dengan ukuran yang kecil, misalnya 16x16, seperti contoh gambar diatas, gambar bullet list yang saya gunakan ukurannya 12x10. Untuk cara merubah ukuran gambar, kalian bisa baca di artikel cara membuat icon untuk website menggunakan photoshop.
Agar tidak memberatkan loading blog, buatlah gambar dengan format Gif. Karena dengan menggunakan format Gif, ukuran gambar bisa dibawah 1kb, seperti contoh gambar, itu ukurannya hanya 873byte. Satu lagi kelebihan format gif, background gambar transparant. Jadi yang terlihat hanya bagian yang berwarna saja.
Agar tidak memberatkan loading blog, buatlah gambar dengan format Gif. Karena dengan menggunakan format Gif, ukuran gambar bisa dibawah 1kb, seperti contoh gambar, itu ukurannya hanya 873byte. Satu lagi kelebihan format gif, background gambar transparant. Jadi yang terlihat hanya bagian yang berwarna saja.
Setelah selesai membuat gambar, upload gambar dan ambil Url nya. Caranya bisa baca di artikel cara upload dan ambil url gambar. Dan gunakan url tersebut ke dalam kode .post ul { list-style(url gambar kamu sendiri);}. Selesai. Semoga bisa bermanfaat untuk anda.
EmoticonEmoticon