GoogleFonts auf der eigenen Homepage verwenden

Du möchtest eine andere Schriftarten für deine eigene kostenlose Homepage verwenden? Mit den GoogleFonts ist der Einbau und die Verwendung “anderer” Schriftarten ein Kinderspiel.

1. Öffne die Seite https://www.google.com/fonts
2. Suche dir aus den knapp 700 Schriftarten die für dich passende aus.
3. Unterhalb des Textbeispiels der jeweiligen Schriftart findest du rechts mehrere Buttons, unter anderem ein Rechteck mit einem Pfeil nach oben, ein Rechteck mit einem Pfeil nach rechts, ein Rechteck und einen blauen Button “Add to Collection”
4. Klicke mit der Maus auf das Rechteck mit dem Pfeil nach rechts und es öffnet sich ein neues Fenster.
5. Wähle per Checkboxen die Schrifttypen, die du verwenden möchtest ( Punkt 1 ).
6. Sollte deine Seite in einer Fremdsprache verfasst sein, dann ist für die der Punkt 2 noch interessant.
7. Ansonsten zeigt dir Punkt 3 mit Standard direkt den Code an, den du bei Design unter Designeinstellungen unter dem Punkt “Text über dem Design” eintragen kannst.
8. Unter 4. zeigt dir GoogleFonts an, wie der CSS Codeschnipsel lautet, den du benötigst, um die neue Schriftart zu verwenden.

<style type="text/css">
h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }
</style>

Wenn du diesen CSS Snippet nun bei den Designeinstellungen bei dem Punkt “Text unter dem Design” einträgst und das “Metrophobic” gegen die von dir ausgewählte Schrift austauscht, dann werden alle h1-Überschriften innerhalb deiner Hompepage im neuen Schriftgewand dargestellt.

Natürlich lassen sich nicht nur die Überschriften anpassen, sondern nahezu jedes Schriftelement.