Abaikan Jika Melihat Iklan Binary Options (Opsi Biner) pada Situs ini, Baca : Perbedaan Forex dengan Binary Options

Daftar Akun XM
image3

Cara Menggunakan Font Awesome pada Blogger

Daftar Akun Exness


Hai Blogger! Berikut adalah Cara untuk Menggunakan Font Awesome pada Blogger :



Pertama anda perlu menambahkan dulu Kode File CSS milik Font Awesome pada Template Anda agar Font Awesome bisa tampil pada Blog.

  • Buka Menu Themes, kemudian klik Edit HTML.
  • Tambahkan Kode File CSS Font Awesome ini dibawah Kode <head>
  • Untuk memudahkan pencarian tekan Crtl dan F, ketik <head> dan tekan Enter.

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

  • Simpan Perubahan Template dan Selanjutnya Gunakan Kode ini Menampilkan Font Awesome :

<i class="fa fa-kode font awesome"></i>

  • Ganti Bagian Kode Font Awesome dengan Ikon yang ingin Ditampilkan. untuk Daftar atau List  Kode Ikon Font Awesome silahkan langsung lihat pada situs Resmi Font Awesome DISINI atau pada situs W3Scholl DISINI

  • Contoh :
 
<span><i class="fa fa-user"></i> <i class="fa fa-coffee"></i> <i class="fa fa-comments"></i> </span>

  • Maka Hasilnya :



  • Untuk Menerapkan Style pada Ikon Font Awesome, lakukan Pengkodean seperti ini :
 
<span><i style="margin-right:10px; font-size:30px; color:#ff6347;" class="fa fa-user"></i> <i style="margin-right:10px; font-size:25px; color:#b1db5c;" class="fa fa-coffee"></i> <i style="margin-right:10px; font-size:20px; color:#54c0e8;" class="fa fa-comments"></i></span>

  • Hasil Style Menjadi :



  • Fungsi dari perintah margin-right:10px; adalah untuk memberikan jarak kekanan sebanyak 10px, silahkan ganti 10px dengan jarak yang diinginkan.
  • Fungsi dari perintah font-size:30px; adalah untuk mengatur besar ikon menjadi 30px, silahkan ganti 30px dengan ukuran yang diinginkan.
  • dan Fungsi dari perintah color:#ff6347; adalah untuk mengatur warna ikon menjadi warna merah (#ff6347) silahkan ganti dengan kode warna yang diinginkan. Kode Warna bisa lihat DISINI

Apabila Ikon Font Awesome tidak mau tampil, coba cek Versi File CSS Font Awesome yang terbaru DISINI (Versi yang saya bagikan diatas adalah Versi 4.3.0)

Semoga Bermanfaat, Happy Blogging :) 

KATEGORI KONTEN : Content Management System

BAGIKAN :

CONVERSATION

Daftar Akun XM