Product pagina

Productpagina

Met de productpaginasjabloon kun je de productpagina aanpassen aan je winkel en producten. Van hieruit kun je de plaatsing, lay-out en inhoud wijzigen.

Productafbeelding

Het bovenste gedeelte van de productpagina is meestal een "Productafbeeldingsectie". Deze sectie bevat het blok "Productafbeelding", dat de productafbeeldingen voor elk product weergeeft.

Productafbeeldingsectie

Algemene instellingen

Met de algemene instellingen voor de sectie kun je zaken als achtergrondkleur, zichtbaarheid en breedte aanpassen. Als je bijvoorbeeld de achtergrondkleur voor de sectie wijzigt, verandert dit de kleur die achter de productafbeelding zelf staat.

Onder geavanceerde instellingen vind je de opties voor kolombreedte. Alle ontwerpen zijn opgebouwd uit 8 kolommen. Door te wijzigen hoeveel kolommen een sectie moet beslaan, kun je de breedte op de pagina aanpassen. Als de productafbeeldingsectie is ingesteld op 4 kolommen, betekent dit dat deze de helft van de productpagina beslaat. Het aantal kolommen kan worden gewijzigd voor alle apparaattypen (pc, tablet en mobiel).

Marge (Afstand)

Marge stelt je in staat de afstand tussen secties aan te passen. Als je bijvoorbeeld een marge van 20px aan de onderkant instelt, betekent dit dat er 20px "lucht" zit tussen deze en de volgende sectie.

Padding

Padding creëert lucht/padding aan de binnenkant van de sectie, in tegenstelling tot marge, die de afstand aan de buitenkant van de sectie bepaalt.

Video

Deze instellingen zijn van toepassing bij het gebruik van een productvideo en beïnvloeden hoe een video verschijnt wanneer je deze op de productpagina opent.

Productafbeelding

Het productafbeeldingblok heeft verschillende instellingen die direct gerelateerd zijn aan de productafbeeldingen, en niet alleen aan de lay-out zoals de productafbeeldingsectie.

Algemene instellingen

• Slideshow: Indien actief, kun je op de productafbeelding klikken om deze in een pop-up/slideshow te bekijken.
• Afbeeldingsbreedte: Pas de breedte van de productafbeelding aan. Voor het beste resultaat wordt aanbevolen deze instelling zo nauwkeurig mogelijk in te stellen om te voorkomen dat de browser een veel grotere afbeelding laadt dan nodig is.
• Pijlen in afbeeldingscarrousel tonen: Indien actief, krijg je knoppen met pijlen boven de productafbeelding waarmee je heen en weer kunt klikken tussen de afbeeldingen. De kleur, achtergrondkleur, afgeronde hoeken en grootte van de pijlen stellen je in staat het uiterlijk aan te passen.
• Pijlen op miniaturen tonen: Vergelijkbaar met de bovenstaande instelling, toont dit pijlen op de miniaturen zodat je eenvoudig tussen afbeeldingen kunt scrollen.
• Automatisch afspelen instellen: Indien actief, veranderen de productafbeeldingen automatisch na x aantal seconden.
• "Lazy Load" voor afbeeldingen inschakelen: De instelling zorgt ervoor dat afbeeldingen pas worden geladen wanneer de sectie aan bezoekers wordt getoond. Als de sectie helemaal bovenaan staat, wordt aanbevolen deze instelling uit te schakelen zodat de productafbeeldingen worden geladen wanneer de productpagina wordt geladen.

Productaankoop

De productaankoopsectie is een van de belangrijkste op een productpagina. Hier vind je de productnaam, prijs, voorraadstatus, aankoopknop en nog veel meer.

Beschikbare blokken

Productaankoop heeft een aantal beschikbare blokken om de nodige informatie aan de klant te tonen. Naast kant-en-klare blokken voor prijs etc., is er ook een tekstblok dat kan worden gebruikt voor vrije tekst en aangepaste HTML.

Vergeet niet dat je de blokken naar wens kunt sorteren door te klikken en te slepen.