Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Ariefchrome - Hallo sahabat Ariefchrome pada kesempatan kali ini saya ingin berbagi artikel tentang bagaimana Cara Mudah Menambahkan Icon di Menu Navigasi Blog. Seringkali waktu kita ingin mempercantik tampilan blog dengan berbagai templates dan seringkali juga, templates blog tersebut belum ada icon di menu navigasi padahal kalu di templates terdapat icon di menu navigasi akan memperindah tampilan blog tersebut.

Cara Mudah Menambahkan Icon di Menu Navigasi Blog saya buat untuk sahabat ariefblog yang lagi ingin edit templates khususnya pada icon menu yang terletak di menu navigasi.disini saya menggunakan jasa dari website Font awesome icon

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Font Awesome Icon ini seringkali digunakan oleh para pembuat templates untuk menambahkan icon - icon yang menarik guna tampilan blog yang profesional.

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Cara Menambahkan Icon pada Script Menu Navigasi

1. Masuklah Akun Blogger, Silahkan Menuju Tema, lalu Edit HTML dan Setelah itu baru tekan CTRL + F, Masukkanlah Kode dibawah ini diatas Kode </head>

<link href='//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css' rel='stylesheet'/>

2. Setelah tadi menempatkan kode untuk memanggil ke Font Awesome, Carilah Menu Navigasi yang ingin ditambahkan Icon, jika kalian sudah menemukannya, Silahkan Pilih icon yang sesui untuk menu anda pada Font Awesome Icon.

3. Kemudian untuk memanggil icon yang sudah anda pilih, Silahkan Masukkan Kode Seperti dibawah dengan penyisipannya sebagai berikut :

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Berikut scriptnya :
<i class='fa fa-nama icon yang kalian pilih'/>

4. Berikut merupakan Icon Navigasi saya, Selanjutnya Buat Icon di Menu Navigasi Blog anda agar tampilan Blog semakin terlihat Lebih Pro lagi.

Cara Mudah Menambahkan Icon di Menu Navigasi Blog

Cara Mudah Mengatur Ukuran Pada Icon
1. Kemudian untuk mengatur besar dan kecil icon anda dapat menggunakan script dibawah ini :

<li><a class='active' href='/'><i class='fa fa-home fa-lg'/> Home</a></li>

2. Dibawah ini adalah Ukuran pada Font Awesome Icon

ICON	KODE
	fa-lg
	fa-2x
	fa-3x
	fa-4x
	fa-5x

PENUTUP
Ariefchrome - Sekian Artikel saya tentang bagaimana Cara Mudah Menambahkan Icon di Menu Navigasi Blog semoga bermanfaat bagi anda, jangan lupa untuk dishare. terimakasih...

Cara Mudah Mengatur Ukuran Pada Icon

Share This :