Cufon Nedir? Nasıl Kullanılır? Türkçe karakter sorunu çözümü.

Cufon, web sayfalarında istediğimiz fontları kullanmamıza imkan sağlayan sIFR’a alternatif son günlerde sıkça karşılaştığımız bir teknik. Bu sayede hoşumuza giden fontları ufak bir işlem ile web sayfalarımızda gösterebiliyoruz. Cufon’un sIFR’dan en önemli farkı metinleri bir flash dosyası gibi göstermeyip resim şeklinde göstermesi. Flashı bir türlü sevememiş biri olarak

Cufon Kullanımı

Cufón’un temelini oluşturan Javascript dosyasını (cufon-yui.js)http://cufon.shoqolate.com/js/cufon-yui.js adresinden indirip uygulamanızın dizinine yükleyin.
Kullanmak istediğiniz yazı tipini Windows/Fonts klasörü dışında bir klasöre kopyalayın. (Örneğin masaüstüne kopyalabilirsiniz)
http://cufon.shoqolate.com/generate/ adresine gidin.
Seçtiğiniz fontu, Regular typeface yazan yere, cufon font dönüştürücüye yükleyin.
The EULAs of these fonts allow Web Embedding (without Adobe Flash) yazan yeri seçili yapın.
Aşağıdan Punctuation yazan yeride seçili hale getirin. Bu işlem ile fontunuza noktalama işaretlerini eklemiş olacaksınız.
.. and also these single characters yazan yere Türkçe karakterleri (IıİıÇçÖöĞğŞşÜüharflerini) girin. Böylece fontumuz Türkçe karakteri desteklemiyor olsa bile, bu karaterleri girdikten sonra artık Türkçe destekli hale gelecek.
Security bölümünde, Limit usage to the following domain(s) bölümüne web sitenizin tam adresini yazarsanız, sitenizden kullandığınız fontu indirenler, başka yerde fontu kullanamazlar. Bu kısım isteğinize bağlıdır. Bu bölümü doldurarak lisanslı fontunuzun başka sitelerde kullanılmasını engellemek amacıyla kullabilirsiniz.
I acknowledge and accept these terms yazan yeride seçili hale getirip LET’S DO THIS! butonuna tıklıyoruz.. Fontunuz bir javascripts dosyasını dönüştürülecek ve size indirmeniz için verecek. Örneğin fontunuz verdana ise, verdana.js olucak.

Font dönüştürme işimiz tamamlandı.Şimdi sıra web sitemize eklenecek kodlara geldi. Sayfamızın <head> </head> tag’leri arasına aşağıdaki kodu ekliyoruz.

<script type="text/javascript" src="/js/cufon-yui.js"></script>

<script type="text/javascript" src="/js/font.js"></script>

<script type="text/javascript">

Cufon.replace('h2', {

textShadow: '#999999 0.4px 0.4px'

});

Cufon.replace(' #rssoku h2,h3,h1,h4,legend');

Cufon.replace(' #headline');

Cufon.replace('#comments h3', {

textShadow: '#fff 0.7px 0.7px'

});

</script>

Yukarıda gördüğünüz gibi öncelikle Cufón’un javascript dosyası cufon-yui.js ekledik. Sonrasında ise fontumuzun javascript dosyasını. Altında ise hangi başlıkların ve metinleri cufon ile görüntülenmesini istediğimizi belirttik.

Cufonda Türkçe Karakter sorunu çözümü

0Cufón kullanımı kısmında Font dönüştürme işleminde 7. sırada belirttiğim gibi .. and also these single characters yazan yere Türkçe karakterleri (IıİıÇçÖöĞğŞşÜü harflerini) girmemiz gerekiyor. Bu sayede oluşturulacak javascript dosyasına Tükçe karakterleri görüntülemek için kod eklenmesini sağlayacağız.

Son olarak web sitemizin veya blogumuzun dil kodlaması UTF-8 olmalı ve dosyalarımız UTF-8 karakter seti ile biçimlendirilmiş olmasına dikkat etmeliyiz. Yoksa Türkçe karakterle görünmez.