kurze Erläuterung zu GoogleFonts. Es gibt etliche GoogleFonts, welcher ihr ab heute im Forum einbinden könnt. Jedoch ist dazu ein etwas nervender Import-Schritt nötig, welcher jedoch nötig ist. Wenn ich nämlich die Schriften alle auf unseren Server spielen würde, müsste der Browser bei jedem Reload alle Fonts laden, was die Ladegeschwindigkeit in die Länge zieht. Daher habe ich diesen nervenden, aber nützlichen Zwischenschritt eingebaut.
Google-Font Import:
Der erste Schritt benötigt folgenden BBCode.
Code: Alles auswählen
[googleimport]"Webfont"[/googleimport]Erstmal suchen wir uns einen Font aus. Dies geschieht auf folgender Seite. Wenn wir einen Webfont haben, wählen wir "Quickuse", um anschließend zu einer Seite, wie dieser zu kommen.
Anschließend gehen wir zu "3. Add this code to your website:" und lassen die Option Standard ausgewählt. Im Codeblock müssen wir uns im Folgenden den passenden Schnipsel heraussuchen. Den Teil, den wir suchen, ist hinter "http://fonts.googleapis.com/css?family=" zu finden und wäre in unserem Fall "Courgette". Es könnten auch direkt mehrere Fonts innerhalb eines BBCodes importiert werden. Um dies zu erreichen, werden diese mit | anhängt.
Somit hätten wir bereits den ersten Schritt geschafft. Unser BBCode würde folgendermaßen aussehen. Der zweite BBCode würde zeigen, wie es mit mehreren Fonts aussehen würde.
Code: Alles auswählen
[googleimport]Courgette[/googleimport]Code: Alles auswählen
[googleimport]Courgette|Caudex[/googleimport]Google-Font Nutzung:
Den gewöhnlichen [ font= ][ /font ] BBCode kennt ihr sicherlich alle. Daher habe ich diesen BBCode auf einer ähnlichen einfachen Basis aufgebaut.
Code: Alles auswählen
[googlefont="Webfont"]"Inhalt"[/googlefont]Hierbei müsste ihr ebenso von der Quickuse-Seite von Google ein paar Informationen entnehmen. Dieses Mal unter Schritt 4 "4. Integrate the fonts into your CSS:". Dort ist der Teil aus dem Codeblock relevant, der in Anführungszeichen gesetzt ist. Hier ebenso "Courgette". Aber Achtung, nicht bei jedem Webfont stimmt die Bezeichnung mit der, die unter "3. Add this code to your website:" genannt ist, überein.
Somit hätten wir wieder einmal den fertigen BBCode.
Code: Alles auswählen
[googlefont=Courgette]Hallo Welt[/googlefont]Zum Schluss noch eine kleine Anmerkung. Innerhalb einer Seite eines Threads (von Vorteil den Import in jedem Beitrag zu wiederholen, wegen möglichen Zitaten) reicht es, wenn ihr einmal den Import verwendet. Der zweite BBCode ist ebenso zu nutzen, wie der [ font= ][ /font ] BBCode.
Ich hoffe, dass euch die kleine Spielerei gefällt. (PS: Beim Begrüßungstext kam genau dieser BBCode zum Einsatz)
Gruß Sascha