Mehrere Schriften verwenden

Thema wurde von gesundheitsgeber, 4. Januar 2017 erstellt.

  1. gesundheitsgeber
    gesundheitsgeber Erfahrener Benutzer
    Registriert seit:
    27. Januar 2014
    Beiträge:
    253
    Danke erhalten:
    4
    Danke vergeben:
    75
    Hallo liebe Gambio Experten,

    in meinem Shop möchte ich gerne mehrere verschieden Google Fonts verwenden.

    Zum Beispiel einen für Überschriften H1 -H5 und einen für Fließtext.

    Nun habe ich es bis jetzt so verstanden - basierend auf diesem Thema, dass man eine Schriftart für den ganzen Shop im SE3 angeben kann und wenn man weitere braucht, muss man das per CSS machen? RIchtig soweit?

    Nun meine Frage - wie würde ich das denn für meinen Fall machen?

    Ich würd gern für die Überschriften diesen Font nutzen:
    <link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">

    und für den Text diesen:
    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">

    Und nun bin ich mit meinem Latein etwas am Ende, wie bringe ich das dem Shop bei :(?

    Habt ihr Ideen für mich?

    Danke euch im Voraus...

    Liebe Grüße
     
  2. Ed
    Ed Erfahrener Benutzer
    Registriert seit:
    6. November 2011
    Beiträge:
    395
    Danke erhalten:
    198
    Danke vergeben:
    141
    Hi,

    du kannst auch mehrere Google Fonts über SE3 einbinden, indem Du Dir bei Google ein "font-paket" zusammenstellst. In Deinem Fall wäre das so im SE3 einzugeben

    Code:
    "https://fonts.googleapis.com/css?family=Lato|Lora"
    Dann benötigst Du css, um die einzelnen Styles zu definieren
    z.B.

    Code:
    H1, H2, H3, H4 {font-family: 'Lato', sans-serif;!important;}
    Muss evtl. wie hier mit "!important" priorisiert werden.

    Das ist vereinfacht dargestellt, optimaler ist, im SE3 noch die notwendigen (nur die) Schrift Styles, die Du bei google fonts unter customize auswählen kannst (100, 300...) mit einzubinden.

    ED
     
  3. gesundheitsgeber
    gesundheitsgeber Erfahrener Benutzer
    Registriert seit:
    27. Januar 2014
    Beiträge:
    253
    Danke erhalten:
    4
    Danke vergeben:
    75
    Hi und Danke,

    kann ich den CSS Code Schnipsel einfach so im SE3 in den CSS Bereich kopieren oder muss ich noch etwas anderes machen?
     
  4. Ed
    Ed Erfahrener Benutzer
    Registriert seit:
    6. November 2011
    Beiträge:
    395
    Danke erhalten:
    198
    Danke vergeben:
    141
    Hi,

    du musst natürlich evtl. das css snippet an Deine Wünsche anpassen. Im Beispiel oben werden alle H1 - H4 Tags nun Lato. Das kannst du dann im SE3 unter CSS eingeben.

    Die Schrifteinbindung wird natürlich nicht bei den css codes eingegeben, sondern im Feld für die google fonts. Der Code oben passt nur, wenn auch nur diese 2 Schriften verwendet werden sollen

    Du kannst mich gerne kontaktieren wenn's zu kompliziert ist

    ED
     
  5. gesundheitsgeber
    gesundheitsgeber Erfahrener Benutzer
    Registriert seit:
    27. Januar 2014
    Beiträge:
    253
    Danke erhalten:
    4
    Danke vergeben:
    75
    Hi Ed,

    ich versuchs mal :) Danke für deine Hilfe!

    Liebe Grüße