Ich habe in der Typografie (in den Theme-Einstellungen) für Text die Schriftart „Inter“ und für Überschriften „Garamond“ festgelegt. Das wird auch korrekt im Frontend ausgegeben, aber nur in Desktop-Browsern. Auf Mobiltelefon (Beispiel iPhone 13 Pro, egal welcher Safari, Chrome etc.) wird jedoch eine Standardschrift verwendet für Headlines, die in Erlebniswelten als H1 bis H6 angegeben sind im Texteditor, also nicht die Garamond. Gibt es hier eine CSS-Klasse, die auf mobilen Devices absichtlich eine andere Schrifttype ausgibt? Das kann ich mir nur schwer vorstellen, da es gar keinen Sinn machen würde!?
Welche Shopware Version nutzt du denn? Standard Theme?
Aktuelle Shopware 6 mit Standard-Theme.
Normal kann das ja nicht sein? Ich sehe keinen Sinn darin und es wurden auch keine Änderungen an Template, CSS o. ä. vorgenommen. Die Typo sollte auf allen Geräten für Fließtext und Headlines gleich sein. Ist das nur bei mir so oder bei allen anderen auch, würde mich interessieren…
Habs eben mal in einem 6.6.5.1 ohne Plugins getestet und die Schrift ist auf Rechner und Mobil identisch. Gibt ja bei vielen Browsern die Entwicklertools, mal geschaut, was die sagen, wenn Du die Seite verkleinerst? Oft kann man ja verschiedene Mobilvarianten simulieren.
Danke, das ist natürlich eine gute Vorgehensweise, in einem „leeren“ SW-Shop zu testen. Allerdings habe ich nur wenige Plugins aktiviert, ich deaktiviere diese aber alle einmal und dann werde ich nach dem Ausschlussprinzip die Störung finden…ggf. ein Plugin, dessen CSS-Code den originären überschreibt.
Ich denke, ich weiß, woran es liegt. Es hat nichts mit mobil o. ä. zu tun, sondern damit, dass ich die Garamond als Headline definiert habe, diese aber nicht ausgeliefert wird originär von SW, sonsten nur die Inter. Auf meinem Desktop-Browser wird die Garamond korrekt dargestellt, da sie im Computer OS installiert ist, auf dem Handy geht das dann nicht, da hier SW nicht auf lokal installierte Schriften zugreifen kann.
Was ist denn die beste und einfachste Lösung, eigene Schriftarten zu verwenden?
Also bei mir auf dem iPhone ging es, ich hab aber nicht nur Garamond, sondern ‚Garamond‘, serif eingetragen. Wie lautet Dein genauer Eintrag?
Sehr seltsam, der Eintrag lautet ‚Garamond‘, sans-serif
Ich habe auch mal ein Plugin (Schriften Einbinden) installiert und dort den Google Font ‚EB Garamond‘, sans-serif eingetragen, geht auch nicht.
Anmerkung: Hochkommas werden hier nicht richtig dargestellt im Texteditor! Der Font ist mit 2 Hochkommas eingeschlossen
Bei Untersuchung des Quellcodes wird im CSS-Code für h1-h6 sogar auch die korrekte Typo angezeigt, jedoch wird die Headline im Text der Erlebniswelt nicht richtig gerendert.
als ich sans-serif stehen hatte (noch von dem ‚Inter‘) war es so, das die „falsche“ Schriftart verwendet wurde. Garamond ist eine Serifenschrift, also sollte „serif“ dahinterstehen, nicht sans-serif. Auf das serif/sans-serif greift er zurück, wenn er die Schriftart (z.B. Garamond) nicht hat. Daher vermutlich der Unterschied bei Dir.
Genau das ist es, darauf hat mich eben der Plugin-Hersteller aufmerksam gemacht. So einfach und ich sehe es nicht. sans-serif in serif abgeändert und schon geht´s. Ansonsten rendert das CSS die Schrift nicht korrekt im Frontend. Selbst wenn der Schriftenname korrekt ist (lokale oder externe Schriften), wenn serif oder sans-serif nicht zur Schrift passt, gibt´s Fehldarstellungen. Es funktioniert einwandfrei mit dem Eintrag ‚Garamond‘, serif in „Schriftart Überschrift“. Gelöst, vielen Dank!
Dieses Thema wurde automatisch 30 Tage nach der letzten Antwort geschlossen. Es sind keine neuen Antworten mehr erlaubt.