Bullet adalah bentuk ikon lingkaran kecil, kotak kecil, atau tanda titik yang biasanya digunakan untuk menjabarkan uraian tertentu dalam bentuk list ke bawah. Selain pada halaman posting, bullet yang umumnya menggunakan kode ul li ini juga biasa digunakan pada tampilan tertentu seperti menu navigasi, link-link tertentu, widget-widget yang dipasang pada bagian sidebar, atau pun pada elemen-elemen blog lainnya.
Beberapa waktu yang lalu, Santos Blog telah membahas mengenai cara mengatasi bullet yang menghilang di postingan blog agar muncul kembali. Nah, kali ini justru kebalikannya, kita akan coba belajar mengenai cara menghilangkan bullet yang muncul pada beberapa widget atau elemen tertentu di blog. Tentu ada beragam alasan mengapa kita justru ingin menghilangkan bullet pada tampilan-tampilan tersebut.
Pada beberapa elemen, alasan bullet perlu dihilangkan biasanya terkait dengan tampilan yang dikehendaki oleh empunya blog. Sebagai contoh, mungkin bullet akan cocok jika muncul di widget-widget list yang berada di bagian sidebar blog. Namun akan tampak kurang luwes jika bullet ini juga muncul pada widget atau elemen bentuk tampilan horizontal yang dipasang di halaman blog. Kebetulan baru-baru ini saya juga mengalami hal tersebut ketika sedang mencoba memasang sebuah widget di salah satu blog saya.
Untuk cara menghilangkannya, silahkan ikuti langkah-langkah di bawah ini.
1. Buka akun blogger anda.
2. Pilih menu thema dan klik edit html.
3. Silahkan cari kode CSS untuk widget atau fitur yang ingin dihilangkan bulletnya.
Jadi, kita hanya akan menghilangkan bullet yang muncul di widget atau fitur itu saja, sehingga bullet yang memang dibutuhkan seperti di dalam postingan bisa tetap bekerja dan berfungsi sebagaimana mestinya.
Adapun cara menghilangkannya yaitu cukup dengan menambahkan kode di bawah ini:
list-style:none;
Atau
list-style-type:none;
Silahkan tambahkan kode tersebut pada CSS ul li untuk fitur atau widget yang anda kehendaki. Sebagai contoh, saya ingin menghilangkan bullet pada widget popular post grid seperti pada tampilan gambar di atas, maka penerapannya akan seperti berikut ini.
#popularpostgrid ul li{width:150px;float:left;height:150px;border-radius:4px;padding:10px;margin-right:10px;margin-bottom:15px;list-style-type:none;}
4. Simpan kembali template dan lihat hasilnya.
Selain cara di atas, ada juga cara lain yang bisa kita gunakan, yaitu dengan menambahkan kode: style='list-style-type: none;' di belakang kode <li> pada html elemen yang dikehendaki. Contohnya seperti di bawah ini.
Mulanya kodenya seperti berikut ini:
<li><a href="https://cobasalam.blogspot.com">Blog Percobaan</a></li>
Setelah ditambahkan, maka menjadi:
<li style='list-style-type: none;'><a href="https://cobasalam.blogspot.com">Blog Percobaan</a></li>
Demikianlah tadi tutorial tentang Cara Menghilangkan Bullet ul li Yang Muncul Pada Beberapa Widget atau Elemen Blog. Semoga bermanfaat.
Labels:
Blogging
Thanks for reading Cara Menghilangkan Bullet ul li Yang Muncul Pada Beberapa Widget atau Elemen Blog. Please share...!
