Hey, schön Dich zu sehen. Folgende Seite wird Dir empfohlen (Anzeige):
Oft möchte man beim Erstellen einer Webseite auf seine eigenen Schriftarten zurückgreifen. Nur leider geht das im Web nicht so einfach – oder soll ich sagen “ging nicht so einfach”? Ich habe nun eine Möglichkeit gefunden, TrueType Schriften (wie man sie unter Windows als normale Schriftart kennt) in seinen eigenen Blog/Website bringt. Ich zeige, wie man das anstellt.
Technisch wird das Ganze mit Canvas und VML gelöst. Eine kurze Erläuterung von Wikipedia für diie, die nicht wissen, was es ist. Ich wusste es selbst nicht.
Das Canvas-Element ist Bestandteil von HTML5 und gestattet ein dynamisches Rendern von Vektorgrafiken und Bitmap-Grafiken.
Die Vector Markup Language (VML) ist eine Auszeichnungssprache zur Beschreibung zweidimensionaler Vektorgrafiken in XML.
Aber keine Sorge, es ist ganz einfach.
Schritt 1: Cufon-YUI auf Webspace laden. Das ist die komprimierte Version mit nur 18 KB. Für Javascript-Bibliotheken empfehle ich immer einen seperaten Ordner.
Schritt 2: Jetzt muss Cufon Eure Schriftart Cufon-fähig machen. Lade dazu Deine Schriftart, die Du verwenden möchtest, unter diesem Link hoch. Hier kannst Du, falls notwendig, auch eine extra Schriftart für fett-, bzw. kursiv gedruckte Texte verwenden. Die nach dem Klick auf den “Let’s do this!”-Button erhaltene Datei speichert Ihr auch im Javascript-Verzeichnis, in dem Ihr die Cufon-YUI-Datei gespeichert habt.
Schritt 3: Jetzt geht’s ans Eingemachte ;) Öffnet Eure Header-Datei Eurer Website und setzt den Cursor in den <head>-Bereich. Fügt nun folgenden Code ein:
<script src="cufon-yui.js" type="text/javascript"></script> <script src="Vegur_300.font.js" type="text/javascript"></script> <script type="text/javascript"> Cufon.replace('h1'); </script> |
Den Pfad ändert Ihr natürlich noch auf den, Eurer Seite. Und den Namen der ~~~.font.js-Datei ändert Ihr auch auf Euren Font-Namen. Die nächste Zeile “Cufon.replace(‘h1′)”: hier legt Ihr fest, welche HTML-Tags in die Schrift umgewandelt werden. Dies könnt Ihr je nach Belieben verändern. Dann noch alles hochladen und fertig.
Wenn Ihr alles richtig gemacht habt, sehr Ihr nun den von Euch festgelegten Text in einer anderen Schriftart. Bei mir ist es übrigens die Überschrift ;) In diesem Tutorial habe ich alles auf einfacher Art und Weise dargestellt, da es sonst zu kompliziert wirken würde. Genauer nachlesen könnt Ihr das ganze auf der Cufon-Homepage.
So kann man auch sein eigenes Schriftbild auf seinem Blog oder seiner Webseite einbinden: “eigene Schriftart am Computer erstellen“.
Auch interessant:
WordPress-Plugin “Landingsites” unter WordPress 3.5
Bereits den ganzen Tag über sitze ich an diesem Blog, frische ihn auf, gebe ihm neue Kategorien.... und fast bin ich fertig. Währenddessen machte ich ...
Blogparade: Lieblingssoftware für den täglichen Einsatz
Nach langer Zeit beteilige ich mich mal wieder an einer Blogparade. Herausgeber, Veranstalter (wie man es auch immer bezeichnen mag) ist Peer Wandiger...
Evernote Premium für Telekom-Kunden 1 Jahr gratis
Zwar nicht mehr ganz neu die Nachricht, der Vollständigkeit zuliebe schreibe ich aber trotzdem kurz darüber. Die Telekom hat bekannt gegeben, Ihren Ku...
Mobile Slotgames für iPhone & Co.
Pokern ist in Mode und macht Spaß. Das haben viele bereits erkannt. Diesen Boom machen sich viele Entwickler und Firmen zum Nutzen und haben mittlerwe...
Geld verdienen mit Sponsored Posts: Everlinks
Viele betreiben Blogs einfach nur aus Spaß an der Freude. Andere freuen sich, wenn ein wenig Geld durch AdSense mit einfließt. Manche mögen mehrere Ei...
Apple möchte Verkaufsstopp für Samsung Smartphones erreichen
Das reichste Unternehmen der Welt - Apple - hat sich nach dem gewonnenen Patentstreit dazu entschieden, die Einstellung von 8 Smartphones von Samsung ...
Sponsored Links:
[...] Schriften (TT-Fonts) in Website verwenden – Tipp von Payamo [...]