Inhaltsverzeichnis:

1. Plugin / Verkaufskanal aktivieren

2. Shopweite Erlebniswelt

3. Navigation Home Icon

4. Header "Hamburger"-Menü Icon - Tablet

5. Header "Hamburger"-Menü Icon - mobil

6. Header Suche Icon - Smartphone

7. Header Suche Icon

8. Header Merkzettel Icon

9. Header Mein Konto Icon

10. Header Warenkorb Icon

11. Listing Merkzettel Icon - ungefüllt

12. Listing Merkzettel Icon - gefüllt

13. Copyright Icon

Plugin Highlights

Erlebniswelten Element HTML-TWIG für eigene Icons und Code Snippets
Twig, CSS und Javascript direkt im Erlebniswelten Element setzen
Shopware Icons (Header / Footer und Co.) spielend leicht austauschen
Hinzufügen eines Home Icon in der Shopware Navigation

Plugin Dokumentation „Stylefinder für Erlebniswelten, Template und Co.“

Erlebe deinen Shop in neuem Glanz – und spreng die Grenzen des Möglichen!

Mit unserem Stylefinder für Erlebniswelten, Template und Co. Plugin verwandelst du deinen Shop in eine lebendige, bunte Erlebniswelt – und das ganz ohne teure Agenturen! Ob bunte Icons, animierte GIFs oder individuelle Bilder, dieses Plugin gibt dir die volle Kontrolle über das Design deines Shops.

Und das Beste: Es ist so vielseitig, dass es die Grenzen des Machbaren sprengt!

Was kann das Stylefinder für Erlebniswelten, Template und Co. Plugin?

1. Icons und Bilder im ganzen Shop austauschen Tausche Standard-Icons gegen bunte, animierte oder sogar eigene SVG-Icons aus. Dein Shop wird lebendig und einzigartig – und das ganz ohne Programmieraufwand!

2. Eigene Medien hochladen – kinderleicht Lade deine eigenen Bilder, Icons oder animierten GIFs bequem über den integrierten Medien-Manager in die Ordner "Ultra Media Images" oder "Ultra Media Icons" hoch. Deine Kreativität kennt keine Grenzen!

3. Erlebniswelten-Element für unendliche Möglichkeiten Nutze das Erlebniswelten-Element, um individuelle Inhalte zu gestalten – sogar mit Elementen von Drittanbietern. Platziere es überall im Shop: im Header, in der Navigation, im Main Content oder über dem Footer. Hinweis: Für die Nutzung der Erlebniswelten musst du unser eigenes Element einpflegen und mit HTML/Twig, CSS und eventuell JavaScript anpassen. Aber keine Sorge – wir bieten fertige Code-Schnipsel, die du einfach per Copy & Paste einfügst, Variablen anpasst und schon bist du fertig!

4. Beispiele, die begeistern - Sidebar-Navigation mit Accordeon und Icons: Modern, übersichtlich und stylisch. - USP-Leisten: Zeige deine Unique Selling Points in einer 3er, 4er oder 6er Leiste – mit individuellen Texten und Icons. - Rechts ausfahrbare Elemente: Erstelle beliebig viele ausfahrbare Boxen mit Links zu Erlebniswelten oder klassischen Seiten. - Mehr-Lesen-Element: Zeige zusätzliche Inhalte auf clevere Weise.

5. Icons im Header personalisieren Tausche die wichtigsten Header-Icons aus: - Suche-Icons - Merkzettel-Icon - Mein-Konto-Icon - Warenkorb-Icon

6. Merkzettel-Icons im Listing anpassen Individualisiere die Merkzettel-Icons in deinen Produktlistings – sowohl gefüllt als auch ungefüllt.

1. Plugin / Verkaufskanal aktivieren

Aktivieren Sie Ihren Verkaufskanal im Plugin. Möchten Sie das Plugin in einen weiteren Verkaufskanal nutzen können Sie über die Plugin Card„Verkaufskanal“per Auswahlmenü ihre angelegten Verkaufskanäle mit HTML Storefront auswählen.

2. Shopweite Erlebniswelt

Hier aktivieren Sie ihre "Shopweite Erlebniswelt"

Zur Auswahl stehen folgende Positionen:

2.1 Über dem Header (zum Beispiel für eine USP Leiste)

2.2 Über der Navigation (zum Beispiel für Urlaubs Meldungen)

2.3 Über dem Content (zum Beispiel für ein globales Rabatt Aktions-Banner)

2.4 Über dem Footer (zum Beispiel für Icon Boxen über dem Footer)

2.5 Unter dem Footer (zum Beispiel für einen eigenen Footer Inhalt)

wählen Sie als nächstes eine Erlebniswelt aus.

Anschließend wählen Sie aus, Wo dieser Erlebniswelten Inhalt angezeigt werden darf. Dafür stehen Ihnen folgende Optionen zur Auswahl:

- AGB
- Bestellungen - Übersicht
- Bestellungen - Zahlungsart ändern
- Bestellungen - Bestellungen abgeschlossen
- Datenschutz
- Impressum
- Kategorien
- Kontaktformular
- Login
- Mein Konto - Profil
- Mein Konto - Adressen
- Mein Konto - Adresse hinzufügen
- Mein Konto - Adresse bearbeiten
- Mein Konto - Zahlungsarten
- Merkzettel
- Newsletter
- Passwort vergessen
- Produktdetailseite
- Registrierung
- Seite nicht gefunden (404)
- Suchergebnisse
- Startseite
- Versand und Zahlung
- Warenkorb
- Wartungsmodus
- Widerrufsrecht
- Zur Kasse

Möchten Sie die Zeit-Steuerung nutzen so aktivieren Sie diese und geben nachfolgend den Start Zeitpunkt und den End Zeitpunkt.

3. Navigation Home Icon

Setzen Sie ein eigenes Navigation "Home" Icon in den Header Navigation. Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Home" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

4. Header "Hamburger"-Menü Icon - Tablet

Tauschen Sie das Header "Hamburger Menü" Icon für das öffnen des Mobilen Tablet Menü aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Hamburger Menü" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

5. Header "Hamburger"-Menü Icon - mobil

Tauschen Sie das Header "Hamburger" Menü Icon für das öffnen des Mobilen Smartphone Menü aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Hamburger" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

6. Header Suche Icon - Smartphone

Tauschen Sie das Header "Suche" Icon in der Smartphone Ansicht aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Suche" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

7. Header Suche Icon

Tauschen Sie das Header "Suche" Icon in der Tablet und Desktop Ansicht aus.

8. Header Merkzettel Icon

Tauschen Sie das Header "Merkzettel" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Merkzettel" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

9. Header Mein Konto Icon

Tauschen Sie das Header "Mein Konto" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Mein Konto" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

10. Header Warenkorb Icon

Tauschen Sie das Header "Warenkorb" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Warenkorb" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.

11. Listing Merkzettel Icon - ungefüllt

Tauschen Sie das Listing"Merkzettel" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

12. Listing Merkzettel Icon - gefüllt

Tauschen Sie das Listing "Merkzettel" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

13. Copyright Icon

Tauschen Sie das Footer "Copyright" Icon in der Smartphone, Tablet und Desktop Ansicht aus.

Nutzen Sie ggf. die Positionierung wenn nötig. Geben Sie die Icon Größe an. Sollten Sie ein Monochrom Icon einfügen können Sie wenn gewünscht dem "Copyright" Icon einen eigenen Farbwert definieren. Bei einem Multicolor Icon ist dies nicht nötig.