Blok: Producten

Producten

Met het productenblok kun je een selectie van producten uit je webshop weergeven. In dit artikel worden de specifieke instellingen van dit blok toegelicht. 

Algemene blokinstellingen

Product Box Inhoud Selector

Kies welke producten je wilt tonen in het productenblok. Je kunt selecteren uit:

• Nieuwe producten
• Afgeprijsde producten (producten in de uitverkoop)
• Aanbevolen producten
• Verwante producten
• Ook gekocht

Lay-out sjabloon selecteren

Bepaal hoe de producten worden weergegeven:

• Regelmatig: Toont producten in een standaard raster. Producten die niet naast elkaar passen, worden automatisch op een nieuwe rij geplaatst. 
• Carrousel: Toont producten in een horizontale carrousel waar de klant doorheen kan scrollen.

Instellingen voor de carrousel:

• Automatisch afspelen: aan/uit
  Laat de carrousel automatisch scrollen zonder tussenkomst van de gebruiker.
• Interval bij automatisch afspelen
  Bepaalt hoe snel de carrousel automatisch doorschuift wanneer automatisch afspelen is ingeschakeld. Bijvoorbeeld: 3000 ms = elke 3 seconden.
• Herhaal inhoud: aan/uit
  Geeft aan of de carrousel opnieuw begint zodra het laatste product is bereikt.
• Schuifpijlen verbergen: aan/uit
  Toont of verbergt de pijlen waarmee gebruikers handmatig kunnen scrollen.
• Verberg schuifregelaar paginering: aan/uit
  Verbergt of toont de paginering onderaan de carrousel (bijv. bolletjes die de positie aangeven).
• Kleur pijlen
  Stel een aangepaste kleur in voor de schuifpijlen, zodat deze beter passen bij je webshop.
• Afgeronde hoeken
  Maakt de hoeken van de carrousel en/of productboxen afgerond in plaats van recht.
• Grootte pijlen
  Pas de grootte van de schuifpijlen aan, bijvoorbeeld groter voor betere zichtbaarheid of kleiner voor een subtielere look.

Toon koopknoppen voor varianten

Toont de beschikbare varianten wanneer je met de muis over het product beweegt. Dit werkt alleen als het product slechts één variant heeft en geen combinatie van varianten.

Product Box Style Selector

Kies de stijl (lay-out) voor het productblok.

Lazy load

Voor het optimaliseren van de laadtijd worden productafbeeldingen pas geladen wanneer ze in beeld komen.

Geavanceerde instellingen

Bij de geavanceerde instellingen kun je onder andere het aantal kolommen per apparaat (desktop, tablet, en mobiel) instellen, de afstand tussen de kolommen (column gap) bepalen, een icoon toevoegen bij de knop en aangepaste CSS toepassen. 

Gerelateerde artikelen:

• Kolommen voor ontwerpstructuur
• Aangepaste CSS