Font pada tipografi blog adalah bagian yang sangat penting dan tidak bisa di pisahkan dari suatu design blog, pada blogspot sendiri sudah terdapat beberapa font standart yang di sediakan oleh bloger dan dapat diubah jenis ukuran kemiringan huruf. Pada saat kita mendesain tampilan suatu blog terkadang kita tidak puasa pada font standar dan pengen menggantinya dengan font yang sesuai dengan keinginan kita. Sebagai contoh adalah tulisan judul blog, blog saya ini. Saya menggunakan font dengan jenisa huruf ' Jellyka gare de chambord', untuk mengganti bentuk font sesuai yang kita inginkan terdapat berbagai macam cara, antara lain adalah dengan model Cufon. Cufon adalah javascript yang kita pasangkan di blog untuk mengubah font sesuai keinginan kita. Dengan metode ini kita dapat mengupload font sesuai keinginan kta di cufon generator selanjutanya font di download dalam bentuk javascript. Untuk lebih jelasnya adalah sebagai berikut.
Persiapkan
- Download file javascript dari cufon website klik disini saja
- Upload font yang kamu inginkan ke font generator kemudian download javascriptnya
- Upload javascript font tadi di hostingan yang kamu punya ( googlepage, fileave, dll)
Pertama cari kode ]]> kemudian copy kode berikut dibawahnya
<script type="text/javascript" src="/js/cufon-yui.js">
<script type="text/javascript" src="/js/NamaFont.font.js">
cufon-yui.js = adalah alamat file javascript cufon yang udah di download tadi
NamaFont.font.js= adalah alamat file javascript dai font yang udah di upload tadi
Kedua tambahkan kode berikut di bawah kode diatas
<script type="text/javascript">
Cufon.replace('h1', {textShadow: '#fff -1px -1px, #333 1px 1px'});
Cufon.replace('h2', { textShadow: '#000 1px 1px, #666 -1px -1px' });
Cufon.replace('h3', {textShadow: '#000 1px 1px, #999 -1px -1px' });
</script>
atau kode dibawah untuk gradasi warna
Cufon.replace('h1', { color: '-linear-gradient(white, black)'
});
Cufon.replace('h2', {color: '-linear-gradient(red, #fff, #23d559, rgb(0, 0, 0))'
});
Ketiga adalah simpan dan lihat hasilnya dan selamat mencoba
keren..keren...
BalasHapustp caranya binggung...
ada yg lebih praktis gak???
ono, nganggo CSS, tapi font ne g iso milih sesuai keinginan...
BalasHapusbisa nih.. tapi kok cuman judul ya yang berubah fontnya ?? kalau mau semuanya sama postingan/artikel gimana ??
BalasHapusMohon bantuan terima kasih.
@ official blog :
BalasHapuskok cuman judul ya yang berubah fontnya ??
karena pada script yang kedua kita letakkan font di h1, h2,h3, yang notabene adalah h1=judul blog h2=judul sidebar dan h3=adalah judul dari posting/artikel
kalau mau semuanya sama postingan/artikel gimana ??
kalau mau semua huruf diaplikasikan font yang sudah kita pilih tinggal ganti di script yang kedua, bagian h1 diganti dengan body maka semua fon di blog kita akan berubah sesuai font yang sudah kita tentukan. atau kalau kita inginkan hanya bagian tertentu saja yang fontnya kita ganti maka tinggal ganti dengan judul class sesuai bagian di blognya, intinya hanya pada kode script yang kedua.
terimakasih atas kunjungannya semoga dapat menjawab pertanyaan kawan, keep bloging, selamat mencoba
ohh jadi maksudnya begini ya : Cufon.replace('body', { color: '-linear-gradient(white, black)'
BalasHapus});
??
@official blog binsar: yoi di coba aja..
BalasHapusMakasih mas dah sukses berat ni.. ternyata kalau semuanya di ganti font-nya dengan cufon gak bisa di copy paste.. kan jadi enak.. heheh makasih mas.. oya saya kan pake font calibri, jadi kurang terlihat enak. kalau mau di buat tebal musti gimana tuh ? apa pas settingan di cufo-nya ya sebelum jadi java script ???
BalasHapus@Official Blog:
BalasHapusyoi sama-sama, saya juga masih belajar.
Memang pada penggunaannya Cufon tidak bisa di copy paste karena font yg kita ganti dengan cufon merupakan suatu image, jika kita membuka blog yang menggunakan cufon kadang agak lambat baru berganti fontnya, ya ini merupakan kelemahan dari cufon agak lama untuk di akses.
untuk menebalkannya bisa dengan settingan di cufon-nya sebeeum di convert ke javascript atau untuk font latin dapat dengan cara memperbesar font sizenya agar dapat terlihat jelas
aku wis nganggo @font-face fan, iso 100% luwih gampang & ora mbebani loading blog
BalasHapusaku ra ngerti kabeh, lagi ajar.
BalasHapus@ Kotrek :ok!! siap hunting carane
BalasHapus@ Gus Kotang: Ku yo isih ajar Gus....ajar bareng wae
ketoke perlu main Padding & Margin ki Fan :)
BalasHapusngaranku font mu keciliken, angel diwoco.. nek verdana/arial nganggo 13px isih wani. aku nggo georgia 16px we wani Fan.. nek judul nganggo 24-26px isih wani. padding diatur ben enak diwoco, spasi (line height) 1,5 carane nek kowe nganggo font 16px line-height mu 24px ben enak diwoco wae
@koterk: Ok siip nuwun sarane, siap dipraktekkan.
BalasHapuswis isoh nganggo kernest fan?
BalasHapus@ kotrek : yo wis lumayan...
BalasHapusrugi Fan link CSS ng kernest gur nggo header :p
BalasHapush3 ne sisan diganti, po sak .post-body sekalian.. kernest isoh nganggo luwih seko 1 font
nek rep dolanan jawascript. contone sing gampang kie:
BalasHapushttp://www.kaskus.us/showpost.php?p=174506944&postcount=274
mas saya udah nyoba berkali-kali kok gagal terus ya?help...
BalasHapusselalu gini: Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.
Pesan error XML: The element type "script" must be terminated by the matching end-tag "".
@kotrek:iyo!! tapi aku lg pengen ngeneki..!
BalasHapus@Oliver:kalo mncul kode seperti itu biasanya ada kode yang belum di tutup, kalo
Pesan error XML: The element type "script" must be terminated by the matching end-tag "".
bearti ada script yang belum ditutup, munkin dapat di cek kodenya lagi, O Ya ada pilihan pengganti font yang lebih mudah, lebih ringan untuk di buka dan g ribet, yaitu dikenal dengan istilah @font-face, buat tutorialnya mungkin menyusul, atau bisa diserch di google pasti juga sudah banyak, Thanks kunjungannya, salam kenal,
Keren mas.. langsung saya coba..
BalasHapus