Skip to main content

Cara Memasang Icon Keren Di Menu Bar Blog Dengan Font Awesome

cara memasang icon di menu bar blog
cara memasang icon di menu bar blog

Cara Memasang Icon Keren Di Blog Dengan Font Awesome - Dalam mendesain template blog tidak hanya mengubah warna, menyusun element kode, atau mengubah font tulisan yang ada di dalam blog itu sendiri. Namun blog tidak akan begitu terlihat menarik bila tidak dilengkapi dengan icon di setiap menu-menu yang penting seperti navigasi bar ataupun footer content.

Amtread sendiri dulu tampilan templatenya sangat tidak menarik karena cuma terdiri dari tulisan tanpa gambar, namun setelah saya pikir-pikir ternyata menambahkan sedikit gambar icon di template blog ada kerennya juga. Karena saya sejak awal sudah tahu tentang html dan css, maka saya sudah tahu jika ingin menambahkan icon di menu navbar blog harus menuju website Font Awesome.
Website Font Awesome merupakan template yang dikhususkan untuk menyediakan jutaan icon mulai dari yang gratis hingga yang berbayar. Icon yang gratis dengan yang berbayar tidak berbeda jauh kok bagusnya. Keduanya hampir memiliki bentuk yang sama dan maksud yang sama setiap icon yang ada. Kamu bisa memasang icon di blog kamu hanya dengan menempelkan link atau url di edit html blog kamu. Gimana caranya? berikut cara memasang icon di menu bar blog.

Cara Memasang Icon Di Navigasi Bar Blog Dengan Font Awesome

1. Langkah pertama kamu masuk terlebih dahulu ke website fontawesome.



2. Kemudian kamu klik saja yang Start Using Free.



3. Lalu kamu copy saja kode yang berada di dalam kotak. Bisa secara manual ataupun dengan tekan tombol copy yang sudah disediakan.



4. Letakkan kode tadi sebelum tag </head> yang berada di edit html template kamu. Jika sudah tinggal kamu klik save saja. Biasanya tag </head> bisa seperti ini &lt;/head&gt;.



5. Lalu kamu masuk ke menu icons di web font awesome atau dengan mengklik menu disini. Setelah itu kamu cari saja icon yang ingin kamu gunakan dengan menggunakan bahasa Inggris. Jika sudah menemukan font yang disuka silahkan klik saja.



6. Di sini saya akan menggunakan icon hammer, maka saya tinggal copy saja kodenya.



7. Jika sudah dicopy, silahkan letakkan code icon sebelum text navbar. Cek seperti di bawah ini untuk contohnya. Yang saya beri kotak merah itu adalah kode iconnya yang kemudian disusul dengan tulisan menu barnya. Jika sudah tinggal kamu save saja.



8. Kemudian kamu coba lihat blog kamu apakah ada perubahan atau tidak. Jika berhasil maka akan tampil seperti gambar di bawah ini.



Oh ya ini memasang icon untuk menu navigasi bar blog ya dan beda dengan icon favicon blog yang berada di tab browser ya. Jadi jangan sampai nyasar ke artikel lain ya hehe. Sebenarnya icon dari font awesome ini selain bisa diterapkan pada blog, bisa juga kamu terapkan ke website buatan kamu.

Baca juga: Cara Memasang Notifikasi Cookie Di Blog

Kalau kamu mengalami masalah ataupun kebingungan saat mengikuti tutorial di atas, bisa tanyakan melalui form komentar atau bisa chat saya langsung melalui halaman kontak yang telah disediakan. Jangan lupa share artikel ini ya bila menurut kamu bermanfaat, sekian artikel dari amtread.com mengenai Cara Memasang Icon Keren Di Menu Bar Blog Dengan Font Awesome semoga bermanfaat bagi kalian semua.
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar