Home Inside Tutorial - Tip Website Menggunakan Script Cufon pada Web Template
CMSPlaza

Content Management System Website ( CMS)

CMS plaza provides many article containning for CMS Tips and Trick, Tutorials for web development, website maker using CMS system suck as:

Joomla , Wordpress, Drupal, Forum.

Download our Free Extensions , Plugins, Component, Modules for your website gadget bar. We give you free consultation website services for your website marketing, website SEO Search Engine Optimization services, Search Engine submit and many more.

Professional Web design Templates Services

With CMSplaza you do not need to go any where to find the good place for Web designer, webmaster, programming and Web Development. We are here to helping you making the cheap website using CMS like as Joomla, Wordpress.

Get fast web Visitor Traffic

With CMSplaza, we help you to promote your business website to get more visitor or web traffic from social networking website like as facebook, you tube, tweeter, flickr and forum communities web. our Web Application will promote your business into business directories listing for free.

CMS Website Article, Joomla Tips trick

Wordpress Tutorial, Blog website maker

web marketing strategy, SEO tips tutorial

how to use, how to setup, how to create, how to make, this article will solve your web CMS problem from error, setting configuration using PHP, ASP, linux web hosting.

 

Cara - cara membuat website

Di CMS plaza anda akan mempelajari banyak tentang cara praktis dan mudah untuk melakukan berbagai setting website dengan menggunakan seb berbasis cms, seperti blog WP, Wordpress, Joomla! , drupal, cms community dan lainnya.

Bagaiman caranya ?

Cara untuk mempromosikan web di internet

Artikel ini memuat cara praktis dan gampang serta gratis yang anda dapat lakukan dalam melakukan promosi website di situs jejaring sosial, social media untuk webmaster atau web desain pemula dalam membangun sebuah web.

Pelajaran dan tutor membuat pengembangan web development

CMS plaza menawarkan cara cara membangun sebuah website dalam pengembangan situs web. pelajaran dari dasar sampai mahir ini dapat anda lakukan.

Promosi Blog Toko online, Promosi Web Hotel, Property, Travel, Portal News Berita

Artikel blog yang memuat tip tip praktis dalam melakukan iklan web atau promo web di berbagai search engine seperti Yahoo, Google, MSN, Bing, Hotmail.

Tip Tutorial

Menggunakan Script Cufon pada Web Template

Senin, 14 Desember 2009 13:24

cufon textDengan menggunakan Cufón anda bisa menampilkan Font/Huruf apa saja yang digemari untuk bisa di tampilkan di website pada komputer lainnya tanpa kawatir lagi untuk bisa tampil di komputer pengguna lain. Cufón istilah kerennya adalah Fast text replacement with canvas and VML tanpa menggunakan Flash atau Image. Cufon berbeda dengan sIFR yang menggunakan flash, tetapi Cufón hanya berupa javascript.

Membuat Template dengan text Cufon menjadikan pemilik web dapat menggantikan font pada template web mereka dengan huruf variasi dari kesukaan mereka. Ini membolehkan mereka memiliki web/blog dengan font yang unik berbanding menggunakan font standard seperti Arial, Tahoma, Times New Roman, Lucida Sans ataupun Verdana, dll.

Berikut cara pemakaian Cufon pada halaman website anda:

Download dulu file javascript cufon dari website cufon. Cufon dengan yui compressor

Gunakan fasilitas font generator pada website cufon untuk meng-convert font agar dapat digunkan bersama cufon.

Penggunaan / pemasangan script cufon:

1. Tambahkan Script Cufón di <header> </header> halaman website anda (sebelum tag body):

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

 

2. Tambahkan & sesuaikan juga Code CSS Untuk mengaktifkan effect Cufon :

Contoh CSS dibawah ini untuk membuat Text Shadow :

<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>

Contoh CSS dibawah ini untuk membuat Effect Gradiasi huruf :

Cufon.replace('h1', { color: '-linear-gradient(white, black)'
});
Cufon.replace('h2', {color: '-linear-gradient(red, #fff, #23d559, rgb(0, 0, 0))'
});

Ganti dan sesuaikan code warna sesuai keinginan.