Wchodzimy na stronę projektu Cufon i tam ściągamy najnowszą wersję tego skryptu (przycisk Download Source). Teraz wchodzimy na stronę code.google.com i zakładamy swój własny projekt, na który będziemy wrzucać swoje pliki javascript. Google oczywiście umożliwia hostowanie różnych plików, jednak tutaj będą użyte pliki js. Teraz po założeniu projektu przechodzimy w zakładkę Downloads i wrzucamy plik cufon.js poprzez przycisk New Download. Ja zrobiłem to wcześniej dlatego nie musicie już tego robić i możecie po prostu skorzystać z mojego linka.
<script src='http://agahmemnon.googlecode.com/files/cufon.js' type='text/javascript'/>
Jednak jeśli ktoś chce może użyć swojego hostingu. Pierwszy krok mamy za sobą, teraz pozostaje jeszcze kilka równie łatwych. Czas teraz wybrać odpowiednią czcionkę, najlepiej by były to fonty z polskimi znakami, wtedy mamy pewność, że podmienią nam się wszystkie znaki.
Teraz nadszedł czas na wygenerowanie odpowiedniego pliku z wybraną czcionką, wrzucamy ją do generatora zaznaczając oprócz standardowych znaków opcje Latin-1 Supplement, Latin Extended-A, Latin Extended-B. W któryś z tych rozszerzeń znajdują się polskie znaki. Generujemy teraz plik, który również wrzucamy na serwer (np. google.code.com). Ja na tym blogu użyłem fonta PT Sans.
<script src='http://agahmemnon.googlecode.com/files/pt_sans_700.font.js' type='text/javascript'/>
Teraz mamy już gotowe pliki do zastosowania na blogu, wystarczy jeszcze dopisać:
<script type='text/javascript'>
Cufon.replace('h3');
</script>
gdzie h3 to selektor, który ma być podmieniany, gdy chcemy podmienić więcej niż jeden to wystarczy dopisać go po przecinku:
<script type='text/javascript'>
Cufon.replace('h3, .jakas_klasa');
</script>
A gdy chcemy zastosować więcej niż jeden font, dopisujemy jego nazwę:
<script type="text/javascript">
Cufon.replace('h1', { fontFamily: 'Vegur' });
Cufon.replace('h2', { fontFamily: 'Myriad Pro' });
</script>
Cufon to bardzo proste narzędzie, a zarazem bardzo skutecznie, coraz więcej stron wykorzystuje go do generowania własnej typografii na stronach, czy to jako nagłówki, przyciski menu, a ostatnio nawet do podmiany zwykłego tekstu, jedynym mankamentem może być to, że tekst najpierw wczytywany jest standardową czcionką a dopiero potem Cufon "wskakuje" co może być lekko irytujące
Autor: Marcin Piszczek
Interesuję się designem, internetem i nowinkami technicznymi. Z zamiłowania jestem web developerem i web designerem,a od jakiegoś czasu również blogerem. W wolnych chwilach gram w DotA. Kibicuję Zagłębiu.
Masz jakieś sugestie? Napisz do mnie. Możesz mnie również obserwować na Twitterze.
