Cara Memasang Icon Menu Header di Blogger - Max Ikhsan
Advertisement
Advertisement

Cara Memasang Icon Menu Header di Blogger

Coba Anda perhatikan menu yang ada pada header blog ini baik di versi desktop atau pun di versi mobile. Jika Anda perhatikan dengan seksama, maka anda Akan melihat icon sebelum menunya.

Icon tersebut dibuat dengan menggunakan font awesome, sehingga tampilan icon sangat bagus dan memiliki banyak pilihan. Selain itu, untuk melakukan pemasangan icon font awesome pada blog ini tidaklah sulit. Oleh karena itu, silahkan baca cara pemasangannya berikut ini.

Cara Memsang Icon Menu Header 

cara membuat icon menu di blog

Pertama, perhatikan apakah dalam template viomagz anda sudah terdapat script pemanggil font awesomenya seperti di bawah ini.

<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"></link>

Apabila belum ada, maka silahkan copy script di atas dan pastekan sebelum </body>

Jika dalam template Anda sudah terdapat script tersebut, maka langsung saja ke cara pemasangannya.

Cari judul kode di bawah ini!

<!--menu navigasi header start-->

Jika tidak ada, cari kode di bawah ini!

<span class='mline1'></span>

Setelah ditemukan, Anda cari menu navigasi yang anda buat di blog anda. Contohnya seperti di bawah ini.

<li><a href="#">About</a></li>

Atau

<li class="About"><a href="#">Menu</a>
  <ul>
    <li><a href="#">Contact</a></li>
    <li><a href="#">Disclaimer</a></li>
  </ul>
</li>

Untuk memasang icon font awesome di depan kata About, maka anda tingga memodifikasinya menjadi seperti ini.

<li><a href='#'><i aria-hidden='true' class='fa fa-slack'/>  About</a>

Yang ditandai warna kuning adalah kode icon font awesomenya. Jadi ketika anda ingin mengubah iconnya, maka tinggal cari saja kode font awesomenya.

Untuk demonya tidak saya sertakan, karena Anda bisa melihatnya langsung di blog ini.

Nah itulah cara membuat icon di menu template viomagz.

Semoga bermanfaat.

Ikut diskusi
Tutup diskusi
Berkomentarlah dengan bijak dan sopan!
# Silahkan tulis pesan di kolom komentar.
# Pesan akan dibalas saat saya online.
# Komentar spam tidak dipublikasikan.

Posting Komentar