Menggunakan font sendiri di website [firefox solved]
May 9, 2012 at 12:39 pm | blog, CSS3, template | No comment
Ada beberapa cara untuk menggunakan custom font. Menggunakan font tertentu mungkin yang tak lazim di gunakan oleh orang lain adalah salah satu cara untuk mempercantik website kita. Kita bisa mencari macam-macam font yang bisa kita pakai di font squirel atau di direktori font google.
Saya mengasumsikan anda memakai wordpress dengan hosting sendiri. Dan kira kira begini caranya. Di sini saya menggunakan Font Bebas Neue.
1. Masukan fontkit yang akan anda gunakan pada folder theme anda, anda bisa menggunakan folder tersendiri. Biasanya file font terdiri dari beberapa format file seperti otf/ttf, eot, woff dan svg .
2. Kemudian pada file css nya masukan script embed untuk fonnya menggunakan fontface
|
1 2 3 4 5 6 7 8 9 10 11 |
@font-face {
font-family: 'BebasNeueRegular';
src: url('font/BebasNeue-webfont.eot');
src: url('font/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
url('font/BebasNeue-webfont.woff') format('woff'),
url('font/BebasNeue-webfont.ttf') format('truetype'),
url('font/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
font-weight: normal;
font-style: normal;
} |
3. Kemudian pada tentukan di mana font itu akan di gunakan
|
1 2 3 4 5 |
h1 { color: transparent;
font-family: 'BebasNeueRegular';
font-size: 6em;
font-weight: normal;
} |
Dan selesai..? Font anda berubah sesuai keingingan anda..!. Tapi coba, tidak semua browser bisa support embed font seperti ini. Salah satunya adalah firefox, Tambahkan dot slash di depan kode letak font pada css anda
|
1 2 3 4 5 6 7 8 9 10 11 |
@font-face {
font-family: 'BebasNeueRegular';
src: url('./font/BebasNeue-webfont.eot');
src: url('./font/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
url('./font/BebasNeue-webfont.woff') format('woff'),
url('./font/BebasNeue-webfont.ttf') format('truetype'),
url('./font/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
font-weight: normal;
font-style: normal;
} |
Simpan kemudian di reload. Kalau editing anda masih di localhost, biasanya font di browser firefox bisa terbaca. Tapi jika sudah anda upload dan ternyata tidak berjalan di beberapa browser terutama firefox. Kita dengan terpaksa memberikan akses terhadap file lewat .htaccess.
Masukan script ini di file .htaccess anda .
|
1 2 3 4 5 |
<filesmatch "\.(ttf|ttc|otf|eot|woff)$">
<ifmodule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</ifmodule>
</filesmatch> |
Email sepertinya sekarang sudah menjadi barang wajib yang harus punya. Hampir setiap orang mulai ketergantungan dengan memakai social media seperti facebook twitter, Plurk, Koprol atau yang lainnya. Dan pastinya proses registrasi di butuhkan email kan..? Bagi para pekerja kantoran sampai pak tani sekarang punya email demi kemudahan komunikasi yang cepat dan mudah. Untuk beberapa kebutuhan itu saya sendiri tidak mencampurkan dan menggunakan satu email untuk semua kegiatan saya. Untuk pendaftaran social media yang rawan kebobolan data saya memakai email khusus. 
Ini adalah sebuah pengalaman, di mana saya yang awalnya tidak tahu di paksa harus tahu. Berawal dari seorang kenalan yang ingin membuat display berupa web untuk tokonya. Berakhir dengan di buatnya sebuah toko online. Karena kenal akrab, Saya beberkan saja pengetahuan saya seputar web. Bahwa sesungguhnya membuat blog atau website itu mudah. Apa lagi membuat toko online, tidak terlalu susah apa bila kita mengetahuinya dan mau belajar. Bahkan banyak CMS yang bisa kita pakai untuk membuat toko online tanpa kita harus membelinya dan open source. Jadi yang ingin mengembangkannya lagi bisa di oprek dan di utak atik.
Di dunia internet semakin banyak hal-hal yang bisa kita manfaatkan sebagai pembelajaran. dari pada pusing mikirin sinetron 
