# Font Awesome einbinden funtkioniert nicht

**URL:** <https://forum.shopware.com/t/font-awesome-einbinden-funtkioniert-nicht/105525>\
**Category:** Themes & Design\
**Created:** [16. Oktober 2024 um 07:22 UTC](https://forum.shopware.com/t/font-awesome-einbinden-funtkioniert-nicht/105525 "2024-10-16T07:22:19Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![j\_bohlscheid](https://avatars.discourse-cdn.com/v4/letter/j/df788c/32.png) [@j\_bohlscheid](https://forum.shopware.com/u/j_bohlscheid)\
**Post date:** [16. Oktober 2024 um 07:22 UTC](https://forum.shopware.com/t/font-awesome-einbinden-funtkioniert-nicht/105525/1 "2024-10-16T07:22:19Z")

</div>

Hallo zusammen,

da Font Awesome nach einem Theme-Update nicht mehr als Webfont bereitgestellt wird, versuche ich nun verzweifelt, eben diese Webfonts-Dateien einzubinden.

Ich habe die Schriftarten in public/fonts hochgeladen und per CSS eingebunden:

```auto
@font-face {
    font-family:"Font Awesome 6 Brands";
    font-display:block;
    font-weight:400;
    src:url(https://sw6.stalltechnik24.de/fonts/fa-brands-400.woff2) format("woff2"),
    url(https://sw6.stalltechnik24.de/fonts/fa-brands-400.ttf) format("truetype")
}

@font-face {
    font-family:"Font Awesome 6 Free";
    font-display:block;
    font-weight:900;
    src:url(https://sw6.stalltechnik24.de/fonts/fa-solid-900.woff2) format("woff2"),
    url(https://sw6.stalltechnik24.de/fonts/fa-solid-900.ttf) format("truetype")
}

@font-face {
    font-family:"Font Awesome 6 Free";
    font-display:block;
    font-weight:400;
    src:url(https://sw6.stalltechnik24.de/fonts/fa-regular-400.woff2) format("woff2"),
    url(https://sw6.stalltechnik24.de/fonts/fa-regular-400.ttf) format("truetype")
}

```

Die Verlinkung ist korrekt und unter der URL kann ich die Dateien herunterladen.

Mit diesem Code möchte ich ein Icon auf der Seite anzeigen lassen:

```auto
.delivery-information.delivery-available::after {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 40px;
    font-family: 'Font Awesome 6 Free';
    content: '\f48b';
    font-weight: 400;
    font-size: 24px;
    text-align: center;
    color: #253237;
    z-index: 4;
}

```

Leider wird das Icon nicht angezeigt. Es erscheint immer nur ein Platzhalter.

Laut Browserkonsole gibt es keine Probleme.

Was mache ich hier falsch?

---

<div class="post-metadata">

**Author:** ![windes](https://avatars.discourse-cdn.com/v4/letter/w/ac91a4/32.png) [@windes](https://forum.shopware.com/u/windes)\
**Post date:** [16. Oktober 2024 um 08:22 UTC](https://forum.shopware.com/t/font-awesome-einbinden-funtkioniert-nicht/105525/2 "2024-10-16T08:22:19Z")

</div>

Hallo, überprüfe noch mal, die Anweisungen im Stylesheet. So wie Du das hier eingetragen hast funktioniert es schon seit einigen Versionen nicht mehr.

Hier in der Hilfe sind ein paar Beispiele für SCSS Einbindung.

[https://docs.fontawesome.com/web/use-with/scss](https://docs.fontawesome.com/web/use-with/scss)

---

<div class="post-metadata">

**Author:** ![j\_bohlscheid](https://avatars.discourse-cdn.com/v4/letter/j/df788c/32.png) [@j\_bohlscheid](https://forum.shopware.com/u/j_bohlscheid)\
**Post date:** [16. Oktober 2024 um 09:01 UTC](https://forum.shopware.com/t/font-awesome-einbinden-funtkioniert-nicht/105525/3 "2024-10-16T09:01:55Z")

</div>

Erst einmal vielen Dank.

Im Prinzip wird aber hier [https://docs.fontawesome.com/web/add-icons/pseudo-elements](https://docs.fontawesome.com/web/add-icons/pseudo-elements) genau das beschrieben, was ich vorhabe.