Cara Memasang Awensome Icons

Hai.. lama rasanya tidak oret oret disini, langsung aja ya,, apa sih font & icon awensome itu? Gak usah dijelasin lagi deh, yang meu menggunakan font awensome ini langsung saja tambahin kode ini dibawah blog / website anda

<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>

Dalam tutorial ini saya akan menjelaskan bagaimana memasang pada blog flatpress.. yang pertama adalah anda menuju ke hosting anda dahulu, lalu masuk directory fp-interface/themes/ nah setelah itu buka folder tema yang anda gunakan saat ini, misal tema blog anda saat ini adalah legerro, masuk saja folder legerro, temukan file header.tpl buka file tersebut dengan editor kesayangan anda, lalu tambahkan srcipt di atas di bawah kode misal punya saya adalah begini:

<head>
	<title>{$flatpress.title|tag:wp_title:'-'}</title>
	<meta http-equiv="Content-Type" content="text/html; charset={$flatpress.charset}" />
	<link href='http://fonts.googleapis.com/css?family=Ruluko' rel='stylesheet' type='text/css'>
	<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>

nah setelah itu simpan, dan bagaimana cara menggunakan, anda cukup memanggil nama icon awensome dengan cara:

<i class="nama ikon"></i>

misal saya ingin memanggil icon , maka kodenya seperti ini:

<i class=" icon-google-plus"></i>

mudah bukan? untuk merubah ukuran anda bisa menambah berapa x disamping nya contoh:

<i class="icon-name"></i>
<i class="icon-name icon-large"></i>
<i class="icon-name icon-2x"></i>
<i class="icon-name icon-3x"></i>
<i class="icon-name icon-4x"></i>

Untuk pull atau rata kanan dan kiri tambahkan pull setelah nama ikonya:

<i class="icon-name pull-left"></i>
<i class="icon-name pull-right"></i>

Untuk melihat daftar icon, menambah border, memutar gambar icon, flip ke horizontal atau vertikal, dan juga membuat icon berputar spin anda bisa melihat pada halaman Awensome Icons.

Semoga bermanfaat…


Tidak menemukan entri terkait.