Lalu muncul Font Awesome Icons ini, entahlah sejak kapan munculnya font keren ini, tapi sejak kemunculan font yang keren-keren ini banyak situs dan blog yang menggunakannya untuk memperindah tampilan blognya atau situsnya. Font Awesome disini beda sekali dengan font-font yang kalian pikirkan, ya mungkin beberapa dari kalian juga sudah tau apa perbedaannya font ini. Font ini berisi sejumlah ikon-ikon untuk sebuah situs maupun blog bukannya font-font yang biasa kita kenal yang biasanya berisikan huruf-huruf yang sama kerennya juga dengan Font Awesome ini.
Jadi sekarang tahu kan apa itu Font Awesome Icons ini ?, nah pembahasan kita kali ini caranya untuk memasang Font Awesome ini ke blog di Blogger. Caranya cukup mudah sekali kok:
<link href='//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' rel='stylesheet'/>Tinggal pasangkan saja text CSS diatas tepatnya dibawah kode
<head> yang ada di template blog kamu.Untuk menggunakannya juga mudah, tinggal memasang kode yang seperti ini dihalaman mana saja di blog kamu:
<i class='fa fa-youtube'></i>
<i class='fa fa-facebook'></i>
<i class='fa fa-google'></i>
<i class='fa fa-linkedin'></i>Atau bisa juga yang seperti ini:
<i class='fa fa-youtube'/>
<i class='fa fa-facebook'/>
<i class='fa fa-google'/>
<i class='fa fa-linkedin'/>Dan ada cara yang lain juga, yaitu dengan menyisipkannya di antara kode CSS, contohnya saya ambil dari CSS blok tulisan yang sudah saya publikasi sebelumnya di Mad Trik:
.info-kode:before {
content: "\f121";
font-family: 'fontAwesome';
display: block;
position: absolute;
top: 15px;
left: 16px;
color: rgba(0,0,0,.18);
font-size: 24px;
line-height: 1;
}Kamu tidak harus meniru kode diatas, tapi intinya adalah dengan menaruh kode CSS
content:"/f121"; dan font-family: 'fontAwesome'; Font Awesome pun akan muncul di blog kamu. Untuk selebihnya bisa kamu atur sendiri, untuk besar ikonnya kamu bisa memperbesarnya dengan font-size: 5px;, seperti yang sudah saya bilang tadi silahkan atur sendiri sesuai selera kamu.Nah, kode diatas itu hanya ikon untuk brand-brand terkenal macam Google dan Twitter saja, untuk daftar ikon yang lebih lengkapnya lagi silahkan lihat saja dihalaman daftar Font Awesome Icons, disana mungkin ada lebih dari 450 ikon yang siap untuk kamu pasang di situs atau blog kamu.
Jadi pembahasan kali ini sampai disini saja dulu, jika ada pertanyaan lebih lanjut silahkan hubungi dokter *loh*, maksudnya silahkan berkomentar saja lalu kita bahas masalahnya.
No comments:
Post a Comment