{Tutorial} Google-Fonts in den Blog einfügen

Sonntag, 16. August 2015

Hallo ihr Lieben. 
Letztens habe ich euch erklärt wie ihr die Schrift-Art im Posttitel ändern könnt. Leider ist man was Blogger-Schriftarten sehr eingeschränkt, und es gibt auch nicht so viele Schriftarten die man benutzen könnte. 

Allerdings gibt es eine andere Möglichkeit: Ihr könnt Schriftarten von Blogger benutzen. In diesem Tutorial hier erkläre ich euch wie ihr die Google Fonts in euren Blog einfügt. Wie wir sie später verwenden können erkläre ich in einem anderen Tutorial!

Zu allererst müsst ihr in euer CSS. Geht dazu also erst auf Vorlage und dann auf HTML bearbeiten. Dort öffnet ihr dann mit STRG + F die Suchmaschine, und sucht nach:
 </head>

Als nächstes müsst ihr HIER klicken. Euch wird nun eine sehr lange Liste an Schriftarten aufgelistet die ihr benutzen könnt. Wenn ihr eine gefunden habt, die ihr schön findet, und gerne als Post-Titel-, Gadget-Titel- oder als Text-Schrift im Post benutzen wollt (Im Grunde könnt ihr die Schrift dann überall benutzen), klickt hier:

Dann werdet ihr weitergeleitet. Wenn ihr auf der anderen Seite der Schrift seid, scrollt etwas runter, bis ihr folgenden Abschnitt gefunden habt:
markiert und kopiert den kompletten Code via rechtsklick und "kopieren" nun.
 Als nächstes geht ihr wieder auf das andere Fenster in eurem Browser, in dem ihr das HTML offen und den Code gesucht habt. Nun müsst ihr den Code der Schriftart über
</head>
einfügen, sodass es am Ende so aussieht:

Bei dem Code von der Schriftart, also dem Code, den ihr grade über </head> eingefügt habt, habt ihr ja diesen Schnipsel:
<link href='http://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'>

Und hier müsst ihr nun bei dem Schrift-Code ein / hinmachen, sodass der Schriftarten-Code am Ende so aussieht, sonst funktioniert es nicht!:
<link href='http://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'/>

Und das wars eigentlich schon. Das könnt ihr jetzt so oft mit jeder Schriftart die ihr gerne später benutzen würdet machen.

Wie ihr die Schriftarten am Ende auch benutzt zeige ich euch im nächsten Tutorial! :)

Kommentare:

  1. Hallo Ines,

    seit zwei Tagen wurschtel ich mich so herum und versuche eine andere Schriftart auf Blogger zu installieren. Leider klappt es einfach nicht. Habe eine Google Fonts Schrift ausgewählt und packe den Link unter Header, alles fein. Aber, bei GF gibt es einen weiteren Code und den weiß ich nicht einzufügen. Ich möchte gern die Schrift als zusätzliche Schriftart neben Verdana und Co. nutzen. Kannst du mir sagen wie ich das hinbekomme? Ich muss jetzt wirklich aufgeben ;-).

    Herzlichst,

    Nisnis

    AntwortenLöschen
    Antworten
    1. Du musst den ERSTEN Code bei Google Fonts ÜBER < / head > einfügen und beim Code vor der letzten Klammer ein / machen.
      Den zweiten Code bei Google Fonts brauchst du nicht. Guck dir mal das Tutorial an: http://littletalkblog.blogspot.de/2015/08/tutorial-google-schriften-fur-post.html
      Wenn du die GF-Schriftart als Zweite neben Verdana benutzen willst, also als alternative, dann musst du die Schritte im Tutorial befolgen und dann aber wenn du die Schriftart i den Code schreibst "GF-Schriftart xy, Verdana" reinschreiben.

      Löschen