Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Tolong pilih kategori sesuai, jenis posting (pertanyaan atau bukan) dan sertakan tag/topik yang sesuai misal komputer, php, mysql, dll.
Promosi atau posting tidak pada tempatnya akan kami hapus.
Promosi atau posting tidak pada tempatnya akan kami hapus.
Klik link berikut untuk informasi cara menyisipkan kode program supaya tampil rapi dan terformat dengan baik di diskusiweb.com: http://www.diskusiweb.com/discussion/50415/cara-menyisipkan-kode-program-di-diskusiweb-com
Baca cara posting gambar/image di post Anda: http://www.diskusiweb.com/discussion/47345/cara-menyisipkan-menyertakan-image-pada-posting/p1
Baca cara posting gambar/image di post Anda: http://www.diskusiweb.com/discussion/47345/cara-menyisipkan-menyertakan-image-pada-posting/p1
Menggunakan Cufon untuk text font website
Banyak web developer terdahulu mengalami kesulitan untuk menggunakan font sesuai keinginannya, problemnya ber macam2 , dan solusi yang ada ber macam2 juga. Beberapa solusi yang ada, antara lain :
Untuk script lengkapnya lihat sample berikut :
1. Menggunakan CSS ( menggunakan @font-face { } ) memanggil file font bertipe TTF, OTF, EOT (untuk windows)
2. Menggunakan service web font , misal : typekit, linotype, fontdeck dll
3. Menggunakan fungsi graph dari server side programming (misal : GDlib di php)
tentunya dengan segala kelebihan dan kekurangan masing2.
Ada satu alternatif lagi cara menggunakan font pada web, yaitu dengan menggunakan Cufon . prinsip dari Cufon adalah, mengconvert font ke dalam bentuk Json data, dan untuk render font menggunakan library Cufon.
Ada satu alternatif lagi cara menggunakan font pada web, yaitu dengan menggunakan Cufon . prinsip dari Cufon adalah, mengconvert font ke dalam bentuk Json data, dan untuk render font menggunakan library Cufon.
kelebihan menggunakan Cufon adalah kita cuma butuh satu format font untuk di convert ke Json data, dan font support untuk semua browser (FF, IE, Opera, Safari dll) .
Step penggunaannya sangat mudah,
1. Download core cufon di http://cufon.shoqolate.com/js/cufon-yui.js?v=1.09i
2. Pilih font yang anda gunakan , format ( TrueType (TTF) , OpenType (OTF), Printer Font Binary (PFB) atau PostScript fonts )
3. Convert font yang telah anda pilih menggunakan cufon font generator http://cufon.shoqolate.com/generate/
4. Simpan/Download hasil generate font ke folder web .
5. Include file core cufon dan font hasil convert di tag header HTML .
6. Tambahkan cufon function untuk render font hasil convert. syntaxnya : Cufon.replace('#id_target_element')
<script type="text/javascript">
Cufon.replace('#cufon-area');
</script>
Untuk script lengkapnya lihat sample berikut :
Cek hasilnya pada link ini : demo<!doctype html>
<html>
<head><title>Page Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#cufon-area {
font: normal 400px;
text-align: center;
margin-top:100px;
}
</style>
<script type="text/javascript" src="js/cufon.js"></script>
<script type="text/javascript" src="1st_Sortie_400.font.js"></script>
<script type="text/javascript">
Cufon.replace('#cufon-area');
</script>
</head>
<body>
<div id="cufon-area">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
</div>
</body>
</html>
Dokumentasi lengkapnya di : https://github.com/sorccu/cufon/wiki/
Selamat mencoba .
Tagged:
Comments
klo gak mau pake banyak file font punyanya google webfonts, gak perlu didownload di link,import aja
saiya buka di IE8 & IE9 bisa
coba d' cekidot dsana:
testing url: http://demo.whmcs.com/
pake font google yg bernama 'Ubuntu':
cssnya: http://demo.whmcs.com/templates/default/css/whmcs.css
bisa kok
bagusnya buat saiya, bisa pilih fonts dan bikin collections juga ada meteran Impact on page load time jadi kita bisa nyeimbangin keindahan dan kecepatan load halaman web kita
Ada sedikit masalah ketika konten kita diload pake AJAX, cufonnya ga jalan. Jadi, kita harus menyelipkan script cufon replace pada konten parsial tersebut.