De klassieke look van “Bought Together”: bovenaan een fotostrook met plustekens ertussen, ernaast een totaalprijsvak met één call-to-actionknop, en daaronder een lijst met selectievakjes van de items. Vink je een item uit, dan verdwijnt de foto uit de strook, schuiven de plustekens op, en worden het totaal, de besparingsregel en het aantal op de knop meteen bijgewerkt.
Hoe deze template werkt
- De strook volgt de selectie. Alleen aangevinkte items verschijnen in de fotostrook; de eerste zichtbare foto krijgt nooit een plusteken. Max Photos in Strip beperkt hoeveel foto’s er verschijnen (0 = alle; zet 3 voor de strikt klassieke look), en Strip Photo Style regelt hun formaat en rand. De hele strook kan uit met Show Image Strip.
- De knop telt de bundel. Het standaardlabel is Add all %N to Cart — %N wordt live vervangen door het aantal geselecteerde items. Een apart label Button Text (single item) (standaard Add to Cart) wordt gebruikt als er nog maar één item geselecteerd is.
- De lijst met selectievakjes. Elke rij toont een selectievakje, een optionele miniatuur, de productnaam als link, en rechts de prijs; het huidige product krijgt het label This item:. Show Thumbnails in List (aan/uit) wisselt tussen de geïllustreerde lijst en de klassieke look met alleen tekst.
- Compact Mobile View. Op kleine schermen (standaard aan): kleinere foto’s in de strook, het totaalvak verhuist over de volle breedte naar onder de strook, miniaturen krimpen, en extra informatieregels worden verborgen.
- Gedeelde engine. Alles uit de template Buy Together gaat mee: vier stijlaccenten plus look-voorinstellingen voor Title/Buttons/Font/Info-Order, besparingsregel en selectieteller, geanimeerd totaal, een maximum aantal items met een inklapbare link + N more (items die zo verschijnen, zijn niet aangevinkt), standaardselectie, badges met verstandige drempels, laadskelet, Smooth Reveal, Popup Hugs Widget, centrale prijsopmaak, de bevestigingsmeldingen modern/system/custom, en de ingebouwde bescherming tegen verouderde data (Require Current-Page View, standaard aan): de widget verschijnt alleen als de kaart van het huidige product linkt naar de pagina die wordt bekeken, en verbergt zichzelf op andere pagina’s of als de data nog bij de vorige pagina hoort.
- Live demomodus. Tijdens het ontwerpen verschijnen automatisch demoproducten met een werkende strook, totalen en schakelaars — sitebezoekers zien ze nooit.
Goed om te weten
- “This item” is altijd het bekeken product. De kaart van het huidige product is gekoppeld aan de laatste productweergave van de bezoeker, los van het aanbevelingsalgoritme dat je kiest — het algoritme bepaalt alleen de aanbevolen add-ons. In het voorbeeld in de editor kan voorbeelddata iets anders doen lijken; op de live site blijft de koppeling staan.
- Items die erbij verschijnen, zijn niet aangevinkt. Producten achter de link + N more verhogen het totaal nooit ongemerkt; de strook wordt opnieuw opgebouwd telkens als items worden getoond of ingeklapt.
- Foto’s met kapotte of ontbrekende afbeeldingen verwijderen zichzelf automatisch uit de strook in plaats van een icoon voor een kapotte afbeelding te tonen.
- De prijzen en besparingen komen uit je catalogus; de korting komt van je winkel. De widget toont alleen de bundel — een echte bundelkorting vereist een winkelwagenregel in je winkel. Zie Bundelprijs en korting.
- Add all %N to Cart stuurt de aangevinkte items in één aanroep naar de code voor snel toevoegen aan winkelwagen van je account.
- Regels voor social proof en productinformatie zijn beschikbaar, maar staan standaard uit — de klassieke look is bewust strak; zet ze per scope aan als je ze wilt.
- Opgeslagen templatekaarten bevriezen hun code. Sla je kopie in Mijn sjablonen na grote updates opnieuw op.
Gerelateerd
- Buy Together — bundelbouwer met live totaal — de variant met kaarten, met verticale, horizontale en compacte indelingen.
- Knop voor snel toevoegen aan winkelwagen — de code die de knop uitvoert.
- Templates — het overzicht van de volledige templatebibliotheek.