Typografie - Style Edit - Theme - Malibu - Korrekt einstellen?

Hallo Leute

Ich habe mal ein paar Fragen zur Typografie im Style Edit / Malibu Theme.

Wenn ich das unveränderte Malibu Theme in Style Edit lade sehen die Einstellungen dort so aus:

Typografie
Schriftart: "Fira Sans", Arial, sans-serif
Textfarbe: #333333
Schriftgrösse: 14px
Google Web Font Url: (Link nur für registrierte Nutzer sichtbar.)


Soweit so gut...
Nun kann man ja die Schriftart in Style Edit anklicken und bekommt eine Auswahl mit weiteren Schriftarten:
- Roboto
- Open Sans
- Lato
- Slabo
- Oswald
- Source Sans Pro
- Montserrat
- Raleway
- Fire Sans


Okay....

Wenn ich nun z.B. Roboto neu auswähle und abspeichere, ändert sich die Schriftart aber warum bleibt der Punkt bei Google Web Font URL Unverändert? Auch wenn dort eine andere Schrift als Fira Sans gewählt wird - die URL dort lautet immer: (Link nur für registrierte Nutzer sichtbar.)00

Ist das so korrekt oder muss man das manuell ändern? Also wenn ich z.B. Roboto wähle, muss ich die Google Web Font URL dann händisch anpassen? Welchen Sinn hätte es wenn ich nur Roboto verwende, dort diese Fira Sans Google URL drin zu haben?


Zweite Unklarheit: Wenn ich als Schriftart dann wieder "Fira Sans" wähle, steht in der Box nur noch "Fira Sans". Warum fehlt hier nach einer Änderung plötzlich der Rest ? ("Fira Sans", Arial, sans-serif) Wozu ist der Zusatz Arial, sans-serif gedacht und warum steht im unveränderten Malibu das Fira Sans in Gänsefüsschen?

Danke im Vorraus für eure Zeit und Hilfe,

 

Hallo Leute,
Niemand eine Idee hierzu?

Ich habe via StyleEdit folgende Einstellungen bei der Schriftart eingestellt:

'Roboto', Arial, sans-serif
(Link nur für registrierte Nutzer sichtbar.)


Im Anschluss habe ich mir mal das generierte CSS aus der main.min.css angeschaut.

Von der Google Api URL fehlt dort aber jede Spur. Stattdessen werden die @font-face alle aussschliesslich via URL direkt von meinem Server abgerufen.

Code:

@font-face {
{
font-family : 'Roboto';
font-style : normal;
font-weight : 300;
src : url(https://www.meine-seite.de/public/fonts/KFOlCnqEu92Fr1MmSU5fBBc9.ttf) format('truetype');
}

Ich habe mir daraufhin auch das CSS von dem Gambio Malibu Demo Shop angeschaut und dort fehlt zwar auch jede Spur der Google API URL aber dafür werden die Fonts dort noch zusätzich über "local" versucht zu laden?`

Jedenfalls sieht es im main.min.css vom Gambio Malibu Demoshop so aus:

Code:

@font-face {
{
font-family : 'Roboto';
font-style : normal;
font-weight : 300;
src : local('Roboto Light'), local('Roboto-Light'), url(https://demo.gambio-shop.de/shop4/public/fonts/KFOlCnqEu92Fr1MmSU5fBBc9.ttf) format('truetype');
}  }

Frage: Warum fehlt in meinem Shop generierten CSS das "src : local('Roboto'), local('Roboto-Regular')," und es ist nur die URL mit Link zur TTF zu sehen? Warum ist in beiden CSS keine Spur von der Google API? Wofür sollte man das dann im StyleEdit eintragen?

 

Passend dazu habe ich im Forum das hier gefunden:

Da hiess es von Wilken immer "kaputt" ... nun....

"Im Moment kann man da allgemein nichts sehen, weil die Fonteinbindung jetzt gerade reichlich kaputt ist, die funktioniert gerade gar nicht."

(Link nur für registrierte Nutzer sichtbar.)

 

Laut dieser Seite (Link nur für registrierte Nutzer sichtbar.) wird auch hier empfohlen via src:local zu schauen ob die Schrift schon beim Benutzer auf dem PC installiert ist um unschöne Schriftart Wechsel im Ladevorgang zu vermeiden. Dies ist bei mir leider der Fall wie auch schon im oben verlinkten Thread wird die Font teils sogar nach den Bildern angezeigt bzw. springt einmal um.

Wie würde ich das local auch bei mir integrieren können? Einstellung um StyleEdit oder über eigenes CSS oder was wäre die ideale Möglichkeit?

 

Aber laut CSS wird die von mir verwendete Roboto immer nur aus der
"src : url((Link nur für registrierte Nutzer sichtbar.)) format('truetype'); " geladen?

Warum fehlt das Local und warum wird TTF verwendet wenn doch WOFF2 und WOFF wesentlich moderner wären?

WOFF wird im CSS nur für FontAwesome verwendet..

 

Ich bekomme es auch in einem Testshop nicht so hin, wie im Gambio Malibu Demo Store - auch mit den selben Einstellungen kommt es nicht zur src = local im CSS....

 

Ah! Okay....das kann natürlich sein!

Eben mal bei einem relativ grossen CH Shop geschaut, da wird auch auf das Local verzichtet.
Dafür wird dort aber Roboto als WOFF2 & WOFF eingebunden.

Gibt es den eine Möglichkeit wie wir selbst das auch im Gambio Shop hinbekommen und WOFF2/WOFF benutzen können statt TTF?

Die Schrift speichern und auf den Server hochladen sollte ja kein Problem sein aber wie kann man dem Shop mitteilen nur das zu benutzen? Würde das über eigenes CSS gehen?




@font-face {
font-family:Roboto;
font-weight:300;
font-style:normal;
font-display:swap;
src:url(/static/fonts/Roboto/roboto-light-webfont.woff2) format("woff2"),
url(/static/fonts/Roboto/roboto-light-webfont.woff) format("woff")
}

 

Wobei laut dieser Anleitung wird auch local als src benutzt:
(Link nur für registrierte Nutzer sichtbar.)

Leider gilt die wohl nicht mehr...gibt es da eine neue Anleitung für Themes?