Liquid, JavaScript, Themes
Hey zusammen,
ich nutze eine eigene Schriftart, diese habe ich mit einem Code im theme.css eingesetzt.
@font-face {
font-family: 'helvetica';
src: url('helvetica.woff2') format('woff2'),
url('helvetica.woff') format('woff');
font-weight: normal;
font-style: normal;
}
Entsprechend auch h1, h2 usw damit gekennzeichnet.
Mein Problem ist nun, dass die Schrift in der Desktopversion geändert hat, nur in der Mobilen einfach nicht.
Ich hoffe jemand kann mir helfen, weil ich langsam wirklich durchdrehe 😄
Danke vorab
@NewLiters – eine kurze Beobachtung:
Ich halte es für riskant, eine "bekannte" Schriftart so zu überschreiben. In Deinem Fall helvetica. Meine Empfehlung wäre Folgendes zu machen:
1.) Font Face mit Custom-Namen definieren:
@font-face {
font-family: 'MyOwnHelvetica';
src: url('helvetica.woff2') format('woff2'),
url('helvetica.woff') format('woff');
font-weight: normal;
font-style: normal;
}
Font-Deklaration mit Custom-Namen in höchster Prio und Helvetica Font-Stack als Fallback definieren.
body {
font-family: "MyOwnHelvetica", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
Dass Dein Text in bestimmten Browsern nicht korrekt rendert kann ganz einfach darauf zurückzuführen sein, dass der Browser WOFF(2) nicht unterstützt. Hier findest Du eine erweiterte Deklaration mit möglichst breiter Kompatibilität. Wobei ich mir durchaus vorstellen kann, dass einzelne Browser keine Freude damit haben, wenn Du Ihnen die helvetica mit einem Font-Face-Override versiehst und das die Quelle eines Problems sein könnte.
Um das im Detail zu debuggen wär's gut Zugang zum Store zu haben, die genauen URLs, die du getestet hast, und auch konkrete Info zu den Browsern, mit denen Du testest. Idealerweise mit Screenshots.
Liebe Grüße,
Mario
hey,
danke für deine Antwort. Wäre es möglich dich privat zu kontaktieren?
@NewLiters – gerne.
Und klar – du kannst mir ja einfach hier im Forum eine PN schreiben – musst diese aber hier erst aktivieren!.
LG, Mario
Mit dem Lernpfad der Shopify Academy und dem Verified Skills-Badge Expanding Your Sho...
By Shopify Feb 7, 2025Den Verkauf im Großhandel steigern: In der Shopify Academy lernst du, wie das geht, zum...
By Shopify Feb 3, 2025Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024