Pada postingan kali ini saya akan membagikan tips bagaimana cara mudah menambahkan, merubah atau memasang icon pada menu navigasi blog ataupun icon icon yang ada pada halaman blog anda dengan menggunakan font awesome. Tujuan penggunaan icon ini adalah untuk memperindah tampilan blog dan lebih memudahkan pembaca untuk melihat menu-menu navigasi yang ada.
Sebelum kita melangkah pada tutorial sebaiknya ada anda harus tau dulu dimana letak menu bar/ menu navigasi pada blog anda. Untuk pemasangan font awesome pada blog, saya rasa template jaman sekarang sudah menerapkan kode untuk font awesome. Oleh karena itu mari kita simak baik-baik tutorial berikut.
Sebelum anda menerapkan tutorial ini pada blog anda harus memahami terlebih dahulu dimana tata letak manu bar atau menu navigasi pada html blog anda. Balik lagi ke pembahasan kita di awal yaitu Cara Mudah Merubah Icon Pada Blog Dengan Font Awesome, berikut ulasannya.
Cara Mudah Merubah Icon Pada Blog Dengan Font Awesome
1. Buka Blog anda > Hapus terlebih dahulu menu navigasi yang sebelumnya sudah ada > Kemudian ganti dengan kode ini:
<li><a class='ripplelink' href='#'><i aria-hidden='true' class='fa fa-home'/> Home</a></li>Ubah Kode # dengan URL Blog anda
Ubah Home dengan Nama Menu anda
Ubah fa fa-home dengan kode icon lain
2. Kunjungi situs Font Awesome untuk mencari icon yang kalian inginkan kemudian salin saja kode nya
3. Cara untuk mengganti icon kalian tinggal mengganti saja kode fa fa-home dengan icon yang kalian pilih tadi .
4. Jika sudah tinggal Simpan Tema saja
Cara Memasang Hanya Icon Saja pada Menu Blog
Jika anda hanya ingin membuat atau memasang hanya icon saja menu blog, misalnya untuk membuat icon sosial media dan secara otomatis terbuka pada tab baru, maka gunakan kode ini:
<li><a class='ripplelink'
href="#" rel="nofollow noopener" target="_blank" title='Facebook'><i class="fa fa-facebook"></i>Jika ingin membuat Ukuran Icon menjadi Besar maka tambahkan fa-2x disamping kode icon, misalnya seperti ini:
<li><a class='ripplelink'
href="#" rel="nofollow noopener" target="_blank" title='Facebook'><i class="fa fa-facebook fa-2x"></i>
Tampilan Font Awesome
Bagaimana cukup mudah bukan, sekarang tampilan icon pada blog anda terlihat lebih cantik bukan. Demikian Cara Mudah Memasang Code Font Awesome Pada Blogger, semoga informasinya bermanfaat dan sampai jumpa.