Fonts einfügen

[Joshua99]

Guten Tag,

Ich bin gerade dabei, eine neue font unserem Shop hinzuzufügen. Ich habe auch schon die font als woff Datei unter Assets hinzugefügt. Nur hänge ich gerade daran, in welchen Ordner ich 

@font-face {
font-family: "Font name";
src: url("{{ '[font-file-name]' | asset_url }}") format("[font-format]");
}

einfügen muss ?

 am liebsten wäre es mir, wenn ich es schaffen würde die fonts so im code hinzuzufügen, dass man sie hier auswählen kann.

Hat mir da irgendjemand einen Tipp, wie ich das hinbekomme? 

Liebe Grüße

Joshi

[Finer · Accepted solution]

@Joshua99 bei der Angabe der src (erstes Bild) muss die URL in Anführungszeichen gesetzt sein.

also:

src: url('URL') format ('woff');

[Finer]

@Joshua99  da die Schriften im Theme Editor von direkt vom Shopify Server geladen werden, wirst du die Schrift nicht dort einfügen können.

die relevante CSS Zuweisung und Überschreibung kannst du in die Theme.css Datei integrieren oder in einer separaten CSS Datei einfügen. Die zweite Option musst du aber noch ins Theme laden bzw. Referenzieren.

[Joshua99]

@Fin  vielen Dank für deine Antwort, okai dann weiß ich schon mal bescheid, dass man es nur im css abändern kann. Leider finde ich die Theme.css Datei bei mir nicht, ich hab nur eine Theme.liquid Datei, aber die liegt nicht unter Assets. Hast du eine Idee wie Die Datei sonst bei mir heißen könnte? 

Vielen Dank schon im Voraus. 

[Finer]

@Joshua99 das kommt darauf an, welches Theme du verwendest. 

Bei einigen heißt die Datei base.css, style.css oder theme.css.

[Joshua99]

@Finer okai danke dir, ich glaub ich komme immer näher.

Ich habe jetzt meine Schrift bei Dateien hinzugefügt und folgenden Code in theme.liquid hinzugefügt. 

Und weil ich alle Überschriften in der Schrift haben will, hab ich dann in base.css folgenden Code hinzugefügt.

 

Leider habe ich immer noch das Problem, dass es mir nicht die Schrift ändert. hast du da noch eine Idee? 

Vielen Dank und schönen Start in die Woche 🙂 

 

[Finer · Accepted solution]

@Joshua99 bei der Angabe der src (erstes Bild) muss die URL in Anführungszeichen gesetzt sein.

also:

src: url('URL') format ('woff');

[Joshua99]

@Finer Ich hab es abgeändert, es ändert aber leider noch nicht die Schrift in unserem WebShop. Hast du sonst noch eine Idee? 

Schönen Abend 🙂 

[Finer · Accepted solution]

@Joshua99 die @font-face Zuweisung musst du ebenfalls in der CSS setzen, nicht in die theme.liquid.

[Joshua99]

@Finer kann ich dass in der base.css Datei überall hinschreiben ? 

[Finer]

@Joshua99 ja, aber am besten vor der Zuweisung der "neuen" headings (h1-h6).