Cara Mudah Menambahkan Icon pada Menu navigasi Blog

Daftar Isi
Cara menambahkan icon menu di blog

Menambahkan fitur Icon didalam menu navigasi didalam blog, memang saat ini sedang banyak digunakan oleh para blogger guna untuk mempercantik tampilan blog.

Sebenernya Tujuan dari menambahkan fitur Icon didalam menu navigasi yaitu memperjelas maksud dan tujuan dari pada menu navigasi tersebut. Selain itu, tujuannya untuk mendapatkan trafik yang tinggi untuk blog.

Mempunyai Blog dengan Traffic yang tinggi tentu menjadi semua impian Blogger. Karena Traffic adalah kunci dari pada kesuksesan website atau blog. 

Untuk bisa mendapatkan traffic yang Tinggi, perlu beberapa cara yang harus dilakukan, salah satunya tampilan blog. Tampilan blog yang menarik akan bisa membantu meningkatkan traffic blog.

Banyak cara untuk meningkatkan trafik blog, salah satunya dengan menambahkan icon pada menu navigasi. Meskipun terlihat sederhana namun dampaknya akan besar terhadap perkembangan blog. 

Kebanyakan pengunjung akan tertarik mengunjungi sebuah website atau blog  karna tampilannya yang responsif, Unik, Tidak kebanyakan gaya dan sederhana,  sehingga membuat pengunjung terkesan santai ketika membaca atau mencari informasi pada sebuah website.

Pengertian icon

Icon biasa juga disebut simbol, ialah suatu gambar kecil yang menjadi penanda suatu program atau data. Banyak fungsi dari kegunaan Icon. Jika kita terapkan di website atau blog, maka memudahkan orang untuk memahami maksud dan tujuannya. Bisa juga menjadikan tampilan blog menjadi lebih menarik. 

Karena, Tampilan blog yang biasa-biasa saja tentu akan berbeda hasilnya dengan blog yang unik dan luar biasa. pada artikel kali ini saya akan sedikit berbagi pengalaman kepada sobat Bloggers pemula untuk membuat tampilan blog yang sedikit berbeda dengan blog lainnya. yaitu menambah Icon pada menu navigasi di blog. contohnya seperti ini


untuk bisa membuatnya cukup sobat ikuti tutorial ini sampai selesai. baca secara berurutan agar tidak terjadi kesalahan.

Baca juga : Cara mudah dan simple membuat privasi policy di blog

Menambahkan icon di menu navigasi menggunakan font awesome

  • Pertama silahkan sobat masuk ke Font Awesome
  • silahkan cari icon apa yang mau digunakan > lalu copy kode Icon tersebut > lalu simpan di notepad terlebih dahulu
  • Contoh code Icon Address book

<i class="fa fa-address-book" aria-hidden="true"></i>

  • selanjutnya masuk ke "dasbor blogger" sobat
  • pilih menu Thema > pilih titik tiga > pilih edit HTML.
  • setelah masuk silahkan cari "menu navigasi header"
Menu navigasi headher di blog cah Santri hanya ada dua, jadi saya contohkan dua menu ini
  • Lalu ganti kode didalam kotak diatas dengan kode ini
<li><a class='ripplelink' href='#'><i aria-hidden='true' class='fa fa-home'/> Home</a></li>
  • ganti '#' dengan URL halaman, lalu ganti kode fa fa-home dengan kode Icon yang telah di copy tadi dan ubah nama home menjadi menu yang dinginkan sobat, terahir simpan.

contohnya seperti ini 
<li><a class='ripplelink' href='https://www.ardinata.xyz/p/blog-page_54.html?m=1 '><i aria-hidden='true' class='fa fa-address-book'/> Sitemap</a></li>
Hasil akhir menu navigasi headher akan seperti ini


Cara menambah icon pada menu navigasi footer


Untuk caranya sama dengan diatas. Lakukan langkah-langkah diatas dengan tepat. Nanti hasilnya akan seperti ini

Hasil Akhir menu navigasi footer

Jika sudah selesai silahkan lihat hasilnya dihalaman beranda blog sobat.

Itulah Cara Mudah Menambahkan Icon pada Menu navigasi Blog, jika ada masalah atau kebingungan silahkan tinggalkan komentar dibawah. Semoga sukses

Posting Komentar