Der klassische „Bought Together“-Look: oben ein Fotostreifen, verbunden durch Pluszeichen, daneben ein Kasten mit dem Gesamtpreis und einem Call-to-Action-Button, und darunter eine Liste mit Kontrollkästchen für die Artikel. Wird ein Artikel abgewählt, verschwindet sein Foto aus dem Streifen, die Pluszeichen ordnen sich neu, und Summe, Ersparniszeile und Button-Zähler aktualisieren sich sofort.
So funktioniert diese Vorlage
- Der Streifen spiegelt die Auswahl. Nur ausgewählte Artikel erscheinen im Fotostreifen; das erste sichtbare Foto trägt nie ein Pluszeichen. Max Photos in Strip begrenzt, wie viele Fotos erscheinen (0 = alle; 3 für den strengen klassischen Look), und Strip Photo Style steuert Größe und Rahmen. Mit Show Image Strip lässt sich der ganze Streifen ausschalten.
- Der Button zählt das Bundle. Das Standardlabel ist Add all %N to Cart — %N wird live durch die Zahl der ausgewählten Artikel ersetzt. Ein eigenes Label Button Text (single item) (Standard Add to Cart) wird verwendet, wenn nur noch ein Artikel ausgewählt ist.
- Die Liste mit Kontrollkästchen. Jede Zeile zeigt ein Kontrollkästchen, ein optionales Vorschaubild, den Produktnamen als Link und rechts den Preis; das aktuelle Produkt trägt das Label This item:. Show Thumbnails in List (an/aus) wechselt zwischen der bebilderten Liste und dem klassischen Nur-Text-Look.
- Kompakte Mobilansicht. Auf kleinen Bildschirmen (standardmäßig an): kleinere Fotos im Streifen, der Summenkasten rückt in voller Breite unter den Streifen, Vorschaubilder werden kleiner und zusätzliche Infozeilen ausgeblendet.
- Gemeinsame Engine. Alles aus der Vorlage Buy Together gilt auch hier: vier Style accents plus die Look-Presets Title/Buttons/Font/Info-Order, Ersparniszeile und Auswahlzähler, animierte Summe, maximale Artikelzahl mit einklappbarem Link + N more (aufgedeckte Artikel kommen abgewählt dazu), Standardauswahl, Badges mit sinnvollen Schwellenwerten, Lade-Skelett, Smooth Reveal, Popup Hugs Widget, zentrales Preisformat, die Bestätigungs-Toasts modern/system/custom und der eingebaute Schutz vor veralteten Daten (Require Current-Page View, standardmäßig an): Das Widget erscheint nur, wenn die Karte des aktuellen Produkts auf die angesehene Seite verlinkt, und blendet sich auf anderen Seiten oder bei Daten der vorherigen Seite aus.
- Live-Demomodus. Beim Gestalten erscheinen automatisch Demoprodukte mit funktionierendem Streifen, Summen und Schaltern — Besucher der Website sehen sie nie.
Gut zu wissen
- „This item“ ist immer das gerade angesehene Produkt. Die Karte des aktuellen Produkts ist an die letzte Produktansicht des Besuchers gebunden, unabhängig vom gewählten Empfehlungsalgorithmus — der Algorithmus entscheidet nur über die empfohlenen Ergänzungen. In der Editor-Vorschau können Beispieldaten einen anderen Eindruck erwecken; auf der Live-Website hält die Bindung.
- Aufgedeckte Artikel kommen abgewählt dazu. Produkte hinter dem Link + N more erhöhen die Summe nie unbemerkt; der Streifen baut sich neu auf, sobald Artikel auf- oder zugeklappt werden.
- Fotos mit defekten oder fehlenden Bildern entfernen sich selbst aus dem Streifen, statt ein Symbol für ein defektes Bild zu zeigen.
- Social-Proof- und Produktinfozeilen sind verfügbar, aber standardmäßig aus — der klassische Look ist bewusst schlicht; schalten Sie sie pro Bereich ein, wenn Sie sie möchten.
- Gespeicherte Vorlagenkarten frieren ihren Code ein. Speichern Sie Ihre Kopie unter Your templates nach größeren Updates erneut.
Verwandte Artikel
- Buy Together — Bundle-Builder mit Live-Summe — die kartenbasierte Variante mit vertikalem, horizontalem und kompaktem Layout.
- Vorlagen — die Übersicht über die gesamte Vorlagenbibliothek.