Fontawesome deaktivieren bzw. ersetzen

Thema wurde von Andreas Siebold, 27. Mai 2019 erstellt.

  1. Andreas Siebold

    Andreas Siebold Erfahrener Benutzer

    Registriert seit:
    12. März 2019
    Beiträge:
    293
    Danke erhalten:
    47
    Danke vergeben:
    79
    Guten Morgen!

    Auf vielen Seiten müssen bei mir 2 der 3 Fontawesome-Zeichensätze geladen werden. Mich stört daran, dass 150 KB geladen werden müßen – wegen ein paar benützten Zeichen.

    Deswegen habe ich mit einem eigenen über fontello erstellten Zeichensatz experimentiert. Um nicht den Html-Code ändern zu müssen, habe ich die die fa-Klassen überschrieben. Das scheint gut zu funktionieren.

    Wie deaktiviere ich nun im System den Fontawesome-Zeichensatz sauber? Reicht es einfach die CSS-Dateien umzubenennen?
     
  2. Dennis (MotivMonster.de)

    Dennis (MotivMonster.de) G-WARD 2013/14/15/16

    Registriert seit:
    22. September 2011
    Beiträge:
    31.203
    Danke erhalten:
    6.208
    Danke vergeben:
    1.107
    Beruf:
    Mann für alles :)
    Ort:
    Weilburg
    Im neustem Beta wird da wieder was verbessert. fontonello wird entfernt und dafür wieder grafiken verwendet was den wechsel zu anderen Bildchen einfacher macht.
    Die Fonts werden auch nur 1x geladen vom Browser, das macht nicht so viel aus da viel zeit reinzustecken. (meine Meinung nach gibts immer wichtigere Stellen).
    Aufgrud der kommenden anpassung würd ich jedenfalls warten damit bis das neue Theme zeugs und Fonts eingerichtet hast, falls das vorhast kurzfristig.
     
  3. Andreas Siebold

    Andreas Siebold Erfahrener Benutzer

    Registriert seit:
    12. März 2019
    Beiträge:
    293
    Danke erhalten:
    47
    Danke vergeben:
    79
    #3 Andreas Siebold, 27. Mai 2019
    Zuletzt bearbeitet: 27. Mai 2019
    Ging flott und ohne herumgefrickel:

    Einfach die Zeichencodes im fontello-Editor anpassen. Mit @font-face den Font einbinden und per CSS den Font für die fa-Klassen (fa fas fab) neu festlegen. Fontawesome wird vom schlauen System nicht mehr geladen.
     
  4. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    13. November 2018
    Beiträge:
    141
    Danke erhalten:
    3
    Danke vergeben:
    22
    Hallo Andreas, ich habe auch das Problem, dass das Laden von font awesome stark auf die Ladezeit meine shops haut, wie hast du das gelöst? Ich stelle mir vor nur einige Icons zu laden oder es mit anderen font zu versuchen. Wie bist du da vorgegangen? Vielen Dank für deine Antwort. Estrella
     
  5. Andreas Siebold

    Andreas Siebold Erfahrener Benutzer

    Registriert seit:
    12. März 2019
    Beiträge:
    293
    Danke erhalten:
    47
    Danke vergeben:
    79
    Hallo Estrella!

    War eigentlich ganz einfach:

    1. Auf fontello.com einen eigenen Zeichensatz erstellen. Wichtig ist, dass die Hex-Codes mit den Zeichen übereinstimmen und dass die vom System benutzen Zeichen dabei sind. Anbei meine config.json-Datei. Diese einfach bei fontello importieren und anpassen

    2. Die Font-Dateien in ein eigenes Verzeichnis auf deinen Server laden. Am besten die config.json für spätere Erweiterungen mit abspeichern

    3. Im »Eigenes CSS« den Font einbinden und für die Selektoren für den FontAwesome .fa., .fas, .fab den neuen Font zuweiesen. Das sieht bei mir so aus:

    Code:
    @font-face {
      font-family: 'fontello_as2';
      src: url('/templates/Honeygrid/fonts/as/fontello_as2.eot'),
           url('/templates/Honeygrid/fonts/as/fontello_as2.woff2') format('woff2'),
           url('/templates/Honeygrid/fonts/as/fontello_as2.woff') format('woff'),
           url('/templates/Honeygrid/fonts/as/fontello_as2.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
    }
    
    .fa, .fas, .fab {
      font-family: 'fontello_as2' !important;
      font-weight: 400 !important;
      }
    
     

    Anhänge: