Cufon Nedir ? Nasıl Kullanılır ?

hero · 24-01-2012, 11:08

Cufon Nedir ? Nasıl Kullanılır ?
Bu gün bir üyemizin wordpress temasında yaşadığı Türkçe karakter sorununu çözmek için sitesine baktım.Cufon kullanılmıştı ve tema yapımcısı yabancı olduğundan olsa gerek elindeki fontu cufon'a çevirirken Türkçe karakterleri aktif etmemişti.

Peki,cufon nedir ?

Cufon,sIFR benzeri bir uygulamaladır.
sIFR yazdığınız yazıları flash'a çevirirken.
Cufon resime çevirmekte.
Genelde bazı tasarımcılar fontun js ile daha kolay kullanımı sağlamak için Cufon'a başvuruyorlar.

Elimde bir font var,bunu nasıl cufon yapabilirim?

1- Beğendiğiniz fontun dosyasını http://cufon.shoqolate.com/generate/ Bu sitedeki "Regular tpyeface" seçeneği ile seçtikten sonra,

2- "The EULAs of these fonts allow Web Embedding (without Adobe Flash)" yazan yeri seçili hale getirin.

3- "Punctuation" yazan yeri seçili hale getirin.

4- ".. and also these single characters" yazan yere Türkçe karakterleri girin.

Türkçe karakterler: IıİıÇçÖöĞğŞşÜü

Bunu yaparak fontunuz Türkçe karakterleri desteklemese bile artık desteklemesini sağlamış olacağız.Fontunuz Türkçe karakterleri desteklese bile bu Türkçe karakterleri girmeniz gerekir.

5- "Security" bölümünde ki , "Limit usage to the following domain(s)" 'e sitenizin iki haldeki adresini girerek (http://www.webmastersitesi.com,webmastersitesi.com www.webmastersitesi.com,webmastersitesi.com gibi) resime çevirilen yazılarınızın başka sitelerde kullanılmasını engellemiş olursunuz.

6- "I acknowledge and accept these terms" yazan kısmı da seçili hale getiriyoruz.

7- LET’S DO THIS! diyerek işlemi sonlandırıyoruz.

8- Bize gönderdiğimiz fontun js dosyasını indirtiyor.
Bu js temanızın veya sitenizde istediğiniz bir klasöre atabilirsiniz.

Şimdi sıra kodlarda Cufon'u kullanmanız için http://cufon.shoqolate.com/js/cufon-yui.js Bu adresteki cufon-yui.js dosyasını indirmeniz ve bunuda hostunuzda bir yere atmanız gerekmektedir.

İki dosyasımızıda attıktan sonra;

<head> ve </head> html taglarımızın arasına;

Kod: #
<script type="text/javascript" src="cufon-yui.js yi attığınız kısmın adresi"></script>
<script type="text/javascript" src=" Fontunuzun Js'sini attığınız kısmın adresi"></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>
Şeklinde kodlarımızı iki js dosyamızı da temamıza entegre ediyoruz.
Buradaki

ismailakdogan · 09-02-2012, 21:13

Yazı için teşekkürler, Cufonu kullandıkça daha iyi anlayacaksınızdır.
Ufak bir ekleme yapacağım css'te yazmış olduğunuz hover tanımlarının cufonla çalışabilmesi için aşağıdaki gibi bir kod kullanmanız gerekir.

Cufon.replace('.mp_regular2', { fontFamily: 'Myriad Pro Regular', hover: true });

24-01-2012, 11:08	#1
hero Adana Şubesi Mesajlar: 999 Tecrübe Puanı: 1 Rep Puanı: 10 Rep Derecesi :	Cufon Nedir ? Nasıl Kullanılır ? Cufon Nedir ? Nasıl Kullanılır ? Bu gün bir üyemizin wordpress temasında yaşadığı Türkçe karakter sorununu çözmek için sitesine baktım.Cufon kullanılmıştı ve tema yapımcısı yabancı olduğundan olsa gerek elindeki fontu cufon'a çevirirken Türkçe karakterleri aktif etmemişti. Peki,cufon nedir ? Cufon,sIFR benzeri bir uygulamaladır. sIFR yazdığınız yazıları flash'a çevirirken. Cufon resime çevirmekte. Genelde bazı tasarımcılar fontun js ile daha kolay kullanımı sağlamak için Cufon'a başvuruyorlar. Elimde bir font var,bunu nasıl cufon yapabilirim? 1- Beğendiğiniz fontun dosyasını http://cufon.shoqolate.com/generate/ Bu sitedeki "Regular tpyeface" seçeneği ile seçtikten sonra, 2- "The EULAs of these fonts allow Web Embedding (without Adobe Flash)" yazan yeri seçili hale getirin. 3- "Punctuation" yazan yeri seçili hale getirin. 4- ".. and also these single characters" yazan yere Türkçe karakterleri girin. Türkçe karakterler: IıİıÇçÖöĞğŞşÜü Bunu yaparak fontunuz Türkçe karakterleri desteklemese bile artık desteklemesini sağlamış olacağız.Fontunuz Türkçe karakterleri desteklese bile bu Türkçe karakterleri girmeniz gerekir. 5- "Security" bölümünde ki , "Limit usage to the following domain(s)" 'e sitenizin iki haldeki adresini girerek (http://www.webmastersitesi.com,webmastersitesi.com www.webmastersitesi.com,webmastersitesi.com gibi) resime çevirilen yazılarınızın başka sitelerde kullanılmasını engellemiş olursunuz. 6- "I acknowledge and accept these terms" yazan kısmı da seçili hale getiriyoruz. 7- LET’S DO THIS! diyerek işlemi sonlandırıyoruz. 8- Bize gönderdiğimiz fontun js dosyasını indirtiyor. Bu js temanızın veya sitenizde istediğiniz bir klasöre atabilirsiniz. Şimdi sıra kodlarda Cufon'u kullanmanız için http://cufon.shoqolate.com/js/cufon-yui.js Bu adresteki cufon-yui.js dosyasını indirmeniz ve bunuda hostunuzda bir yere atmanız gerekmektedir. İki dosyasımızıda attıktan sonra; <head> ve </head> html taglarımızın arasına; Kod: # <script type="text/javascript" src="cufon-yui.js yi attığınız kısmın adresi"></script> <script type="text/javascript" src=" Fontunuzun Js'sini attığınız kısmın adresi"></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> Şeklinde kodlarımızı iki js dosyamızı da temamıza entegre ediyoruz. Buradaki Paylaş Share this post on Digg Del.icio.us Technorati Twitter

09-02-2012, 21:13	#2
ismailakdogan İstanbul Anadolu Şubesi Yaş: 23 Mesajlar: 3 Tecrübe Puanı: 1 Rep Puanı: 10 Rep Derecesi :	Yazı için teşekkürler, Cufonu kullandıkça daha iyi anlayacaksınızdır. Ufak bir ekleme yapacağım css'te yazmış olduğunuz hover tanımlarının cufonla çalışabilmesi için aşağıdaki gibi bir kod kullanmanız gerekir. Cufon.replace('.mp_regular2', { fontFamily: 'Myriad Pro Regular', hover: true }); Paylaş Share this post on Digg Del.icio.us Technorati Twitter

Seçenekler
Yazdırılabilir şekli göster Sayfayı E-Mail olarak gönder
Stil
Normal Hybrid-Şeklinde gösterime geç Ağaç şeklinde gösterime geç

Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)