Cara Menambahkan Icon Pada Menu Navigasi Blog Terbaru 2021, Mudah!
Hi blogger!
Apa kabarnya nih, semoga baik-baik saja ya, di artikel kali ini kita akan
membahas cara menambahkan icon pada menu navigasi blog, icon biasanya
ditambahkan pada navigasi blog supaya menambah kesan profesional dan elegan
ketika pengunjung datang ke blog tersebut. Selain itu, pemilik Template atau
pengembang sebuah Template blog juga memanfaatkan icon untuk membuat Template
hasil karyanya tersebut bernilai plus karena adanya icon yang menambah nilai
elegan dan menarik konsumen untuk menggunakan template tersebut.
Pemilik Template umumnya hanya menambah icon pada menu media sosial di bagian
footer dan icon penelusuran, nah, bagi kamu yang ingin menambahkan icon pada
menu navigasi blog, ikuti langkah-langkah berikut ini.
Cara Menambahkan Icon Pada Menu Navigasi Blog
Sebelum lanjut ke langkah pertama, kalian harus lebih dahulu memasang Script
pemanggil icon font awesome supaya icon nya bisa muncul, karena di tutor ini
kita menggunakan font awesome yang lebih ringan size nya dan ngak menambah
waktu Load blog, copy kode Script di bawah ini dan paste kan atau letakkan
tepat di bawah kode <head>, berikut
kode Script pemanggil nya:
<script crossorigin='anonymous' src='https://kit.fontawesome.com/1e7ba994d7.js'/>
Atau kamu bisa juga mendatar di font awesome untuk mendapatkan kode Script
pemanggil diatas, jika sudah kamu pasang kodenya, klik simpan, lalu lanjutkan
dengan langkah-langkah memasang icon pada menu navigasi blog.
Langkah 1:
Akses ke
font awesome icon, disini kamu ngak perlu login, dihalaman ini akan ada sederetan vertikal
icon yang sangat banyak, pilih salah satu yang menurut kalian cocok dengan
menu navigasi kalian, setelah selesai memilih, klik icon pilihan kalian,
kemudian salin kode icon yang diberikan.
Langkah 2:
Setelah kalian salin kode icon nya, pastekan di notepad terlebih dahulu agar
kode nya tidak hilang, kemudian masuk ke menu theme di dashboard blogger,
kemudian klik edit html.
Supaya mencegah terjadinya error' template nantinya karena kesalahan ngoding, sebelum klik edit html pilih cadangkan untuk mendownload Template
Langkah 3:
Setelah kamu berada di edit html, klik ctrl+f agar memunculkan kotak
penelusuran dan ketikkan salah satu nama menu navigasi blog kamu, kemudian
klik enter di keyboard, setelah itu akan muncul kode navigasi nya.
Note : 'nama menu navigasi berwarna hitam di menu edit html'
Langkah 4:
Paste kan atau letakkan kode icon tadi seperti langkah 1 sebelum kode nama
menu navigasi yang berwarna hitam, seperti keterangan di bawah
<li><a href="https://www.domain.com/p/sitemap.html">tempelkan disini nama menu navigasi</a></li>
Kode diatas merupakan contoh kode menu navigasi, kebetulan Template Viomaqz saya ini edit menu navigasinya di tata letak, bukan di edit html, keterangan nya:
- Tempel disini : Tempel kode icon
- Nama menu navigasi : nama salah satu menu navigasi blog kamu.
Setelah itu, lanjutkan memasang icon pada navigasi blog yang lain di kode menu
navigasi lainnya, caranya sama seperti cara yang diatas, semoga berhasil!
Berikut cara menambahkan icon pada menu navigasi blog, semoga bermanfaat,
Assalamualaikum.wr.wb