Astroid Framework - Fonts lokal laden (absoluter Pfad beim Compilen)

  • Hallo,


    ich hoffe ich bin hier im richtigen Unterforum.


    Ich habe auf einer Seite das Astroid Framework in Nutzung und versuche nun vergebens die Fonts lokal zu laden.


    Mein Problem ist, dass die Domain ohne www die Fonts nicht findet, weil Astroid den absoluten Datei-Pfad mit https://www.beispiel-url.de compiled hat. Ich weiß gar nicht wie ich das ändern soll. Es kommt dann in den Dev Tools folgende Meldung:


    Access to font at 'https://www.beispiel-url.de/fonts/opensans-semibold-webfont.ttf' from origin 'https://beispiel-url.de' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.



    Das andere Problem:

    In der Index.php im Backend wird der Head-Bereich nicht vollständig angezeigt, also ich weiß nicht wie ich beeinflussen soll, was geladen wird und was nicht. Es werden head-styles und head-scripts geladen. Aber ich finde nirgends die Quelle um dort z.B. die Zeile mit Google-Apis zu entfernen. Ich dachte eigentlich, wenn ich die Fonts lokal einbinde und nutze, dass dann erst gar keine Google-Fonts mehr geladen werden müssen? Und wieso werden auch AwesomeFonts geladen?

    Code
    <head>   <astroid:include type="head-meta" /> <!-- document meta -->   <jdoc:include type="head" /> <!-- joomla head -->   <astroid:include type="head-styles" /> <!-- head styles -->   <astroid:include type="head-scripts" /> <!-- head scripts -->
    
    [...]
    
    </head>

    Kann mir hier jemand helfen?


    Danke und LG

  • Das wird doch ganz einfach im Astroid Framework beim Template in den Optionen eingestellt.

    Einfach die fonts bei google herunterladen und in den Templateordner fonts auf dem Websever kopieren.

    Dann in den Template-Optionen die Fonts von lokal auswählen.

  • Und wieso werden auch AwesomeFonts geladen?

    Gehe in das Plugin "Astroid Plugin". Dort findest du die relevanten Einstellungen.


    Wieso werden geladen? Weil Astroid-Templates halt auch Icons verwenden. Da seine eigenen Wege einzuschlagen ist etwas aufwendig; also andere Icon-Fonts zu verwenden. Dafür benötigt man diverse Overrides und/oder muss ins SCSS/CSS eingreifen.

  • Das wird doch ganz einfach im Astroid Framework beim Template in den Optionen eingestellt.

    Einfach die fonts bei google herunterladen und in den Templateordner fonts auf dem Websever kopieren.

    Dann in den Template-Optionen die Fonts von lokal auswählen.

    Entschuldigt, wenn ich mich nicht klar ausgedrückt habe. So wie du es WM-Loose beschreibst, habe ich es auch gemacht. Aber, dann kommt über die DevTools im Browser, eben diese Meldung:


    Access to font at 'https://www.beispiel-url.de/fonts/opensans-semibold-webfont.ttf' from origin 'https://beispiel-url.de' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.


    Ich verstehe das so, dass aufgrund dessen, dass Astroid den Dateipfad für die Fonts absolut und nicht relativ erstellt (kann man dann in der compiled-CSS Dateie sehen welchen Font-Pfad er gebaut hat) - und diesen eben mit www - werden die Fonts nun irgendwie nicht richtig geladen/verwendet. Rufe ich die Domain explizit mit www. auf, lädt er die Fonts korrekt. Ich habe dafür aber glaube ich eine Lösung...zumindest probiere ich mal was.


    Gehe in das Plugin "Astroid Plugin". Dort findest du die relevanten Einstellungen.


    Wieso werden geladen? Weil Astroid-Templates halt auch Icons verwenden. Da seine eigenen Wege einzuschlagen ist etwas aufwendig; also andere Icon-Fonts zu verwenden. Dafür benötigt man diverse Overrides und/oder muss ins SCSS/CSS eingreifen.

    Diese Info wiederum war sehr hilfreich! In den Plugin-Einstellungen kann man das Laden von Fontawesome abstellen. Danke!


    LG

  • Access to font at 'https://www.beispiel-url.de/fonts/opensans-semibold-webfont.ttf' from origin 'https://beispiel-url.de' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.


    Du solltest dir mittels Redirect in deiner .htaccess eine Weiterleitung von ohne www nach mit www einrichten.

    Dieser doppelte Content ist sowieso nicht ratsam.


    Apache Configuration
    RewriteEngine On
    RewriteCond %{HTTP_HOST} !^www.deinedomain.de$
    RewriteRule ^(.*)$ https://www.deinedomain.de/$1 [R=301,L]
  • Du solltest dir mittels Redirect in deiner .htaccess eine Weiterleitung von ohne www nach mit www einrichten.

    Dieser doppelte Content ist sowieso nicht ratsam.


    Apache Configuration
    RewriteEngine On
    RewriteCond %{HTTP_HOST} !^www.deinedomain.de$
    RewriteRule ^(.*)$ https://www.deinedomain.de/$1 [R=301,L]

    Danke, dass war auch meine Idee und habe ich gemacht.


    Allerdings werden immer noch externe Links zu googleapis und gstatic eingebunden. Aber die Fonts werden immerhin nun richtig geladen.


    Hast du denn z.B. das HTTP Header Plugin aktiv oder vielleicht in der .htaccess zu strikte Regeln?

    Das genannte Plugin hab ich nicht bei mir gefunden.


    LG

  • Allerdings werden immer noch externe Links zu googleapis und gstatic eingebunden. Aber die Fonts werden immerhin nun richtig geladen.


    Dann brauchen wir mal einen Link zur Seite!


    Das genannte Plugin hab ich nicht bei mir gefunden.

    Du nutzt ja vermutlich Joomla 3, dort ist es noch nicht vorhanden (erst ab Joomla 4)


    Aber ein Blick in die .htaccess könnte auch hilfreich sein.

  • Oh Sorry. Wollte mich nicht undankbar zeigen :)


    Elwood also nochmal danke für deine Antwort via PM. In den Template-Einstellungen war soweit alles korrekt, ich hab da bestimmt 5x reingeschaut. Aber die Startseite wurde mit dem JD-Builder gebaut, und man kann da ja jede Section, Column, Row usw. mit einzelnen Inhalten befüllen. Und dort war irgendwo eine Zelle mit bisschen Text, wo noch "Open Sans" als Font ausgewählt war, statt dem sonst eingestellten Default-Font (welcher dann den loaklen Font geladen hätte). Ich hab mich da echt dusselig gesucht, weil ich es wohl anfangs auch noch übersehen hatte. Es sind ja manchmal die banalen Dinge.... oops

  • Access to font at 'https://www.beispiel-url.de/fonts/opensans-semibold-webfont.ttf' from origin 'https://beispiel-url.de' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

    Das ist ja anderweitig gelöst, aber Astroid macht das eiiiiigentlich in einem seiner Helper richtig. Abgesehen davon, dass man darüber streiten kann, ob da wirklich die Domain eingebaut werden muss (was mir, wäre ich betroffen, eine Einreichung auf GitHub wert wäre). Ich täte sagen nein, sollte eigentlich raus die Domain.


    Es identifiziert je Seitenaufruf richtig, ob www oder nicht rein gehört. So wie Joomla das auch macht. JUri::root.


    Aaaaber: Ab dem Moment, wo Seiten aus dem Cache geladen werden und CORS-Regeln dazwischenfunken, stimmen die Domains im Inline-CSS natürlich nicht mehr immer überein und obiges Problem tritt auf.