Cara Menambahkan Font Awesome Pada Bootstrap
Monday 22 June 2015
Edit
Biasanya para pengguna bootstrap menggunakan icon glyphicon untuk memperindah tampilan aplikasi maupun website yang di buat, glyphicon sudah terinclude di dalam bootstrap akan tetapi masih kurang banyak icon yang bisa kita manfaatkan sesuai kebutuhan, oleh karenanya Font Awesome bisa di jadikan referensi untuk icon yang kita butuhkan pada saat membangun website base on bootstrap. Pada dasarnya penggunaan Font Awesome sama saja dengan penggunaan icon glyphicon yaitu kita hanya tingga memanggil classnya saja, untuk memulainya silahkan download langsung file di website repositorynya di github Font Awesome, atau langsung saja gunakan File secara online berikut confignya silahkan copas dibawah tag <head>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
Untuk pemanggilan fontnya sama saja dengan pemanggilan class icon glyphicon hanya bedanya pada glyphicon menggunkan tag <span class="glyphicon glyphicon-send"></span> , untuk font awesome menggunkan tag <i></i> contohnya seperti berikut :
<i class="fa fa-rocket fa-2x"></i>
dari pemanggilan class tersebut maka akan tampil icon rocket seperti di bawah ini :
nah untuk membuat animasi rocket berputar cukup tambahkan fa-spin pada classnya, lihat code berikut :
<i class="fa fa-rocket fa-spin fa-2x"></i>
hasil dari pamanggilan class tersebut kita akan mendapatkan sebuah icon rocket yang berputar putar.
bagaimana.? keren kan.? pastinya ya karena kita bisa mendapatkan banyak icon yang bisa kita manfaatkan sesuai kebutuhan kita membangun sebuah website maupun web aplikasi, untukdokumentasi lengkap bisa langsung menuju dokumentasi Font Awesome. Semoga tutorial singkat ini bisa bermanfaat dan berguna bagi anda yang sedang mencari referensi icon untuk mengembangkan website.
Selamat Mencoba