Cara Terbaru Memasang serta Menggunakan Font Awesome

Selamat datang kembali di Demo IdBoegis, Blog yang membahas seputar Tips Adsense, Tips Komputer, Tutorial Blog, SSH Gratis, Tips Youtube, Tips Smartphone dan informasi internet lainnya.

Pada Artikel kali ini kita akan membahas Cara Terbaru Memasang serta Menggunakan Font Awesome, Postingan ini masih berhubungan dengan Artikel Tutorial Blog.

Baca juga:

Cara Terbaru Memasang serta Menggunakan Font Awesome

Advertisement

Cara memasang font awesome di Blog - Kali ini saya akan membagikan cara untuk memasang dan menggunakan fonts awesome pada blog, namun sebelumnya saya akan sedikit menjelaskan mengenai apa sif fonts awesome dan apa kegunaannya? Font awesome merupakan kumpulan icon serta tombol yang pada dasarnya hanya berbasis font tanpa gambar. Kegunaan dari pemasangan font ini pun beragam, bisa di gunakan untuk mendesign blog yang secara tidak langsung juga dapat meringankan loading blog sobat.

Dari namanya sudah bisa kita ketahui, bahwa font awesome terdiri dari kumpulan angka ataupun huruf. Jadi apabila sobat ingin merubah warna dan ukurannya, sobat hanya perlu menambahkan CSS ke dalam template blog sobat. Oke langsung saja, bagi anda yang ingin memasang font awesome di blog sobat bisa mengikuti langkah-langkah di bawah ini.

Cara Memasang serta Menggunakan Font Awesome

1. Pertama, silahkan sobat masuk ke halaman template blog sobat.
2. Untuk dapat menggunakan font awesome, sobat di haruskan menyimpan kode CSS di bawah ini kedalam template blog sobat.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">

Letakkan CSS tersebut di atas kode </head>

3. Selanjutnya silahkan simpan template sobat.

Untuk penggunaannya, mengingat font awesome telah melakukan update terbarunya, maka dalam penggunaan anda harus menambahkan kode di bawah ini :

<i class="kode disini"></i>

Contoh penggunaan :

<i class="fa fa-camera-retro"></i>

Namun apabila sobat ingin memperbesar iconnya, maka sobat hanya perlu menambahkan fa-1x, fa-2x, fa-3x, fa-4x, fa-5x pada setiap akhir kode iconnya sesuai ukuran yang anda inginkan. Contoh penulisan :

<i class="fa fa-camera-retro fa-lg"></i>
<i class="fa fa-camera-retro fa-2x"></i>
<i class="fa fa-camera-retro fa-3x"></i>
<i class="fa fa-camera-retro fa-4x"></i>
<i class="fa fa-camera-retro fa-5x"></i>

Maka hasilnya akan nampak seperti gambar di bawah ini :

Itulah cara terbaru dalam memasang font awesome dan cara penggunaannya dalam blog, apabila dari sobat sekalian masih kebingungan denga cara di atas, silahkan tinggalkan komentar sobat. Semoga artikel di atas bermanfaat dan selamat mencoba :)