Erste Schritte

In dieser Anleitung bauen Sie eine Kampagnen-Kachel von Grund auf und sehen zu, wie sie in einem echten Kategorielisting erscheint. Das dauert etwa zehn Minuten.

Am Ende haben Sie einen Banner mit Überschrift, Call-to-Action und Hintergrundbild, der im fünften Slot einer Kategorieseite sitzt und zwei Produktzellen breit ist.

Bevor Sie anfangen

Sie brauchen:

• Einen Shopware-6.7-Shop mit installiertem und aktiviertem Listing Interrupter & Banner Studio.
• Admin-Zugang mit den Listing-Interrupter-Berechtigungen (ein Administrator hat sie).
• Eine Kategorie, die bereits einige Produkte enthält, und den Verkaufskanal, zu dem diese Kategorie gehört.
• Ein Bild in der Medienverwaltung als Hintergrund für den Banner.

Schritt 1 — Das Modul öffnen

Gehen Sie im Admin zu Marketing → Listing Interrupter.

Die Liste zeigt alle Kacheln des Shops. Bei einer frischen Installation ist sie leer.

Schritt 2 — Eine Kachel erstellen

Klicken Sie auf Interrupter erstellen.

Die neue Kachel öffnet sich im Tab Inhalt. Sie ist bereits aktiv und startet als einzellige Kachel in Slot 1 auf Seite 1 — das ändern Sie gleich.

Schritt 3 — Die Kachel benennen

Tippen Sie in der Karte Allgemein einen Namen ein:

Sommer-Sale Hero

Der Name ist intern. Kundinnen und Kunden sehen ihn nie; er identifiziert die Kachel in der Liste.

Schritt 4 — Den Banner texten

Füllen Sie die Karte Inhalt aus. Jedes Feld hier ist übersetzbar — Sie bearbeiten die Sprache, die oben in der Kopfleiste ausgewählt ist.

1. Hintergrundbild — klicken Sie auf die Medienfläche und wählen Sie ein Bild aus Ihrer Medienverwaltung.
2. Badge-Zeile — tippen Sie SOMMER-SALE. Das ist die kleine Zeile über der Überschrift.
3. Überschrift — tippen Sie Bis zu 50 % auf Sommer-Looks.
4. Unterzeile — tippen Sie Nur solange der Vorrat reicht — wöchentlich neue Teile.
5. CTA-Text — tippen Sie Zum Sale.
6. Link-Typ — wählen Sie Kategorie und dann die Kategorie, die der Button öffnen soll.

Beobachten Sie die Live-Vorschau rechts. Sie zeichnet sich bei jedem Tastendruck neu, die Kachel nimmt also beim Tippen Gestalt an.

Schritt 5 — Die Kachel gestalten

Scrollen Sie zur Karte Erscheinungsbild und setzen Sie:

• Textfarbe — Weiß.
• Overlay — Dunkler Verlauf · 40 %. Das Overlay dunkelt Ihr Hintergrundbild ab, damit der Text darauf lesbar bleibt.
• Inhaltsausrichtung — Links.
• Vertikale Ausrichtung — Unten.

Schritt 6 — Festlegen, wo die Kachel läuft

Wechseln Sie in den Tab Platzierung.

In der Karte Wo sie erscheint:

1. Kategorien — haken Sie die Kategorie an, die Sie unter Bevor Sie anfangen ausgewählt haben.
2. Verkaufskanäle — fügen Sie den Verkaufskanal hinzu, zu dem diese Kategorie gehört.

Lassen Sie Verfügbarkeitsregeln leer. Eine leere Regelliste bedeutet: alle sehen die Kachel.

Beide Felder sind entscheidend: Eine Kachel ohne Kategorie oder ohne Verkaufskanal wird in der Storefront nie angezeigt.

Schritt 7 — Die Kachel im Raster platzieren

Darunter hat die Karte Platzierung pro Gerät die echten Produkte dieser Kategorie auf eine Fläche geladen. Ihre Kachel sitzt in Slot 1, markiert mit Ihre Kachel · Position 1.

1. Ziehen Sie die Kachel auf das fünfte Produkt. Sie rastet in diesen Slot ein und schiebt die dahinterliegenden Produkte eine Zelle weiter.
2. Fassen Sie den Griff am rechten Rand der Kachel an und ziehen Sie ihn eine Zelle nach rechts. Die Kachel ist jetzt zwei Produktzellen breit.

Schritt 8 — Speichern

Klicken Sie oben auf Speichern. Eine Bestätigung erscheint: Interrupter gespeichert.

Die Kachel bleibt geöffnet. Wenn Sie zurück zu Marketing → Listing Interrupter gehen, steht sie dort jetzt mit dem Status Live.

Schritt 9 — In der Storefront ansehen

Öffnen Sie die Kategorieseite in Ihrer Storefront und laden Sie sie neu.

Ihr Banner sitzt im fünften Slot, zwei Zellen breit, mit Badge, Überschrift, Unterzeile und Button. Das Listing schließt weiterhin mit einer vollen Rasterzeile ab: Die Kachel hat den Platz von zwei Produkten eingenommen, und diese beiden Produkte sind auf die nächste Seite gerückt — verschwunden sind sie nicht.

Sie haben keinen Cache geleert. Das Speichern einer Kachel aktualisiert die betroffenen Listing-Seiten von selbst.

Was Sie gebaut haben

Eine Banner-Kachel, ausgerichtet auf eine Kategorie in einem Verkaufskanal, platziert in Slot 5 auf Seite 1 und zwei Zellen breit.

Nächste Schritte

• Eine Kachel im Raster platzieren — Seiten, mehrere Kacheln, Hero über die ganze Zeile.
• Eine Kachel ausrichten — Seitenbereiche, Zielgruppen und Kampagnen-Zeiträume.
• Eine Kachel für Tablet und Mobil anpassen.
• Konzepte — was ein Slot wirklich ist und warum das Raster voll bleibt.