Cara Mudah Menambah Icon Gambar Pada Menu Blogger

Advertisement

Sedekah Ilmu, Menyajikan artikel berkualitas yang memberi manfaat adalah salah satu cara agar blog kita sering dikunjungi para peselancar dunia maya, dan membuat pengunjung blog betah berlama - lama singgah di blog, adalah salah satu tujuan para blogger. Banyak manfaat yang didapatkan dari jumlah pengunjung blog kita, semakin banyak dan sering blog kita dikunjungi, maka blog kita akan mudah ditemukan di search engine. selain itu posisi blog kita di alexa pasti juga akan naik.

Selain artikel, banyak faktor lain yang menjadi penentu jumlah visitor, rutin melakukan update artikel, rutin berbagi artikel ke sosial media, dan tampilan blog yang menarik menjadi faktor lain untuk menjadikan blog kita nomer wahid (aminnn). 

Nah, disini saya akan sedikit membahas mengenai tampilan blog, terlepas dari template blog yang kita gunakan responsif atau tidak, saya ingin mebagikan bagaimana cara menambahkan icon gambar pada menu utama blog kita, selain mampu mempercantik tampilan blog, menambahkan icon gambar pada menu horisontal, bagi saya akan membuat blog kita lebih terlihat profesional dan terlihat sebagai situs yang berkualitas.

pingin bikin menu seperti gambar diatas ? oke kita langsung ke TeKaPe

Untuk menu horisontal yang include dalam template, caranya :

1. Masuk ke Dasbord Blog kamu
2. Pilih Template dan klik Edit HTML
3. Cari kode html Menu blog kamu. untuk para blogger newbie alias baru belajar, kamu bisa mencari kode tersebut dengan cara tekan Ctrl + F (biasanya kode CSS/html berbeda - beda di masing masing template), cara mudah menemukannya, kamu tinggal mencari satu kata yang tampil di menu horisontal, bagi kamu blogger yang sudah terbiasa ngotak atik template langkah ini bukan sesuatu yang sulit.
4. Kemudian sisipkan kode html di bawah ini diantara kode menu, misalkan kode menu html menu kamu seperti berikut :   <li><a href='/'>Beranda</a></li> 
   
   
   tambahkan kode : <img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE8LVd7IGUUKtPP_sVeZS5t63e0b6rt7fJ0jNeET9xTsj-GHqmQOBVOL6hOCcNF5UfNbC_-Vs2HW3nGLII4AJ5KWJJTKLqVS4hHxMarxuz_h_Bjt2nOEuCOEeCGaqeqIvY50Wjn0Z26cNQ/s1600/home+1.png' style='padding:0px;'/>
   
   
   pasang kode tersebut setelah kode <li><a href='/'> sehingga kodenya menjadi seperti dibawah ini : 
   <li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE8LVd7IGUUKtPP_sVeZS5t63e0b6rt7fJ0jNeET9xTsj-GHqmQOBVOL6hOCcNF5UfNbC_-Vs2HW3nGLII4AJ5KWJJTKLqVS4hHxMarxuz_h_Bjt2nOEuCOEeCGaqeqIvY50Wjn0Z26cNQ/s1600/home+1.png' style='padding:0px;'/> Beranda</a></li>
5. Lakukan hal yang sama pada kode menu lainnya, terakhir Klik simpan, dan lihat hasilnya

Catatan :

• kode berwarna merah adalah url icon gambar, silahkan ganti dengan url icon gambar favorit kamu.
• pertimbangkan untuk menerapkan artikel diatas ke dalam template blog kamu, karena sedikit banyak, menambah icon gambar pastinya akan mempengaruhi kecepatan loading blog kamu, meskipun hal itu hanya berefek kecil.

Demikian sedikit pengetahuan dari saya, semoga bermanfaat untuk blogger semua, untuk cara menambah icon gambar pada menu vertikal, akan saya bahas pada artikel selanjutnya. terima kasih telah sudi membaca artikel ini. Berbagi Itu Indah (703)