Safari kriegt lädt eingebundene Fonts nicht

    Hallo,

    habe heute meinen verwendeten Google-Font mit Autoptmizer gelöscht/blockiert und auf meinem Server geladen.
    Chrome und Firefox haben kein Problem, den Font vom Server zu laden. Safari kriegt das weder am Desktop noch in der Mobile-App gebacken.
    Hat da jemand Rat, womit man Safari einladen muss?

    Betrifft https://hoellbacher.online

    Danke schon mal.

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Eine Reihe von Dateien fehlen an entspr. Stelle auf dem Server, siehe Browser Konsole z.B. auch bei Firefox/Windows.

    Danke für dein Post. Ich kann das nicht nachvollziehen (bin da recht unbeholfen).

    Kann es sein, dass der Browser automatisch im themes/fonts-Ordner sucht? Weil platziert hab ich den font-ordner woanders, und Chrome hat da offensichtlich kein Problem, ihn zu finden?

    Befrage eine Suchmaschine Deiner Wahl, wie Du bei Deinem Browser die sog. Browser Konsole öffnen kannst. Dann kannst Du die Meldungen selbst nachvollziehen.

    Deine Beschreibung enthält leider keinerlei Details, z.B. welche Dateien genau Du in welche Ordner geladen hast, wie diese Dateien in Dein Theme eingebunden wurden oder anhand welcher genauen Anleitung Du vorgegangen bist o.ä.

    Tipp am Rande: Der Hersteller von Autoptimize bietet diverse Supportmöglichkeiten an, wenn man mit dem Plugin nicht zurecht kommt.

    Ich bin nach dieser Anleitung vorgegangen.
    https://www.mittwald.de/blog/mittwald/…eiten-einbindet

    * raleway-300 - latin */
    @font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 300;
    src: url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.eot'); /* IE9 Compat Modes */
    src: local('Raleway Light'), local('Raleway-Light'),
    url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.woff') format('woff'), /* Modern Browsers */
    url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('hoellbacher.online/wp-content/themes/sydney-child/fonts/raleway-v14-latin-300.svg#Raleway') format('svg'); /* Legacy iOS */

    Habe fast die gesamte Schriftenfamilie in den entsprechenden Ordner reingeladen und das style.css meine Child-themes entsprechend wie oben ergänzt.

    Danke für deine sogenannte Hilfe.

    Habe das Problem nun selbst lösen können. Jemandem, der sich gut auskennt, hätte es mit ein wenig Interesse sofort erkannt.

    Ich schätze es ja sehr, wenn man hier Hilfe bekommt. Aber auf ein Posting einzugehen, wenn man eigentlich eh keinen Bock hat, ist halt auch nicht sehr fein.

    Einmal editiert, zuletzt von höllbacher.online (15. Februar 2020 um 17:34)

    Das Problem waren fehlende Dateien auf dem Server.

    Diese fehlenden Dateien sind in #2 aufgelistet.

    Die Lösung war das Hochladen dieser fehlenden Dateien.

    Glückwunsch, dass Du das nun selbst lösen konntest. :)

    Das Problem hatte damit nichts zu tun.

    Die Dateien waren ja oben, Chrome und Firefox hatte auch keine Probleme, die Fonts zu finden.
    Allein Safari verlangte fürs CSS den kompletten Pfad – inkl. "https://".

    Die Lösung war eben nicht, vermeintlich fehlende Dateien hochzuladen.

    Das CSS wurde im Verlauf diverse Male verändert, komplette Pfade sind nicht nötig, mit [FONT=Courier New]url('fonts/...'[/FONT] sollte auch Safari die Dateien dort laden können, wo sie sich jetzt befinden.

    Nungut, dann ist das bei Dir wohl ein Spezialfall.

    Bei all den lokalen Einbindungen von Webfonts, die ich in den letzten Jahren umgesetzt habe, war für Safari noch nie ein kompletter Pfad nötig.

    Der komplette Pfad ist nötig, wenn der variable Pfad falsch gesetzt wurde.

    Zitat von b3317133

    Eine Reihe von Dateien fehlen an entspr. Stelle auf dem Server, siehe Browser Konsole z.B. auch bei Firefox/Windows.

    Code
    downloadable font: download failed (font-family: "Raleway" style:normal weight:400 stretch:100 src index:3): status=2147746065 source: https://[..]/wp-content/themes/fonts/raleway-v14-latin-regular.woff2


    Vergleiche das mit dem

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    @SirEctor Das CSS auf dem Server wurde im Verlauf diverse Male verändert, zum Zeitpunkt des Logs aus #2 stand da noch überall [FONT=Courier New]url('../fonts/rale..[/FONT]

    Ergänzung: Und bei den Pfaden im geposteten CSS-Auszug fehlt das Protokoll, d.h. der ganze Pfad wird als Unterordner und Unterunterordner usw. des Childthemes betrachtet.

    Wie in #10 beschrieben sollte mit [FONT=Courier New]url('fonts/...'[/FONT] jeder Browser die Dateien dort laden können, wo sie sich jetzt befinden.

    4 Mal editiert, zuletzt von b3317133 (15. Februar 2020 um 22:11)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden