Navigation

Shopware 6 Icons

Entdecke die vielfältigen Möglichkeiten von Shopware 6 Icons. Hier findest du eine durchsuchbare Übersicht aller Icons, praktische Beispiele und Anleitungen für die Integration in dein Shopware-Theme.

Zu allen Icons

Alle Shopware 6 Icons

Shopware 6 stellt zwei Icon-Sets bereit: Default (in ThemeWare®-Themes für Textbausteine & Konfiguration) und Solid (kräftiger, nur in eigenen Twig-Dateien). Wähle das Set und suche nach dem Icon-Namen.

Shopware 6 Icons einbinden

Um Shopware 6 Icons einzubinden, gibt es mehrere Möglichkeiten – je nachdem, wo genau du das Icon verwenden möchtest.

In Template-Dateien einbinden

Um Icons in einer TWIG-Template-Datei zu verwenden, kannst du das sw_icon-Tag nutzen: {% sw_icon 'icon-name' %}. Suche dir das passende Icon, kopiere den Namen und füge ihn als Argument ein.

Beispiel:

{% sw_icon 'truck' %}

In CMS-Blöcke einbinden

Um Shopware 6 Icons in Erlebniswelten einzubinden, nutze einen CMS-Block vom Typ „Text" oder einen HTML-Block. Gib dort den <img>-Tag für das gewünschte Icon ein.

Beispiel:

<img src="/bundles/storefront/assets/icon/default/truck.svg" />

Aktuelle Shopware-Versionen

Der Pfad /bundles/storefront/assets/icon/default/[icon-name].svg funktioniert in aktuellen Shopware-Versionen nicht mehr, da Shopware die Storefront-Icons aus dem öffentlich erreichbaren Bundle-Ordner entfernt hat.

Lade das gewünschte Icon am besten über die Medienverwaltung in deinen Shop hoch und klicke auf „Link kopieren". Den so erhaltenen Link fügst du in dein CMS-Element ein.

Beispiel:

<img src="https://mein-shop.de/media/32/8c/f1/1777296709/truck.svg" />

Shopware 6 Icons downloaden

Möchtest du die Icons als Grafik oder über die Shopware-6-Medienverwaltung nutzen, kannst du sie als SVG herunterladen – auf GitHub oder im folgenden Ordner:

platform/src/Storefront/Resources/app/storefront/dist/assets/icon/

Weiterführende Links