Design

Onder Weergave → Design maak je van je checkout jouw checkout. Je uploadt je logo, zet de achtergrond op je huisstijl en schrijft desgewenst eigen CSS voor de puntjes op de i.

Personaliseer de checkout

"Je kunt de checkout eigen maken door een logo en een achtergrondafbeelding te uploaden. Je kunt ook maatwerk CSS schrijven."

Naar Design

Open je checkout en klik in het checkout-menu op Weergave → Design. De pagina is verdeeld in drie secties: Branding, Achtergrond en Maatwerk CSS.

Sectie 1 - Branding

Je logo en favicon bepalen hoe klanten je checkout herkennen.

Veld	Uitleg	Bestandstypes
Logo	Wordt bovenaan je checkout getoond.	SVG, JPG, PNG, WebP, GIF - max 1 MB
Hoogte logo (px)	Hoogte waarop het logo getoond wordt.	Getal (pixels)
Favicon	Icoon in de browsertab.	PNG, JPG, ICO - max 1 MB
Logo factuur	Logo dat op factuur-PDF's verschijnt.	Zelfde als Logo
Hoogte factuur logo (px)	Hoogte op de factuur.	Getal (pixels)

Gebruik SVG als het kan

SVG-logo's blijven scherp op elk scherm én laden supersnel. Heb je alleen een PNG? Gebruik er dan een met transparante achtergrond.

Sectie 2 - Achtergrond

Je kunt een achtergrondafbeelding uploaden en precies bepalen hoe die op de pagina verschijnt.

Afbeelding - JPG, PNG of GIF, maximaal 5 MB.

Positie

Waar op het scherm de afbeelding begint.

	Links	Midden	Rechts
Boven	✓	✓	✓
Midden	✓	✓	✓
Onder	✓	✓	✓

Negen combinaties in totaal - kies de positie die past bij je ontwerp.

Grootte

Optie	Wat het doet
Automatisch	De afbeelding behoudt zijn originele grootte.
Bedekt	De afbeelding vult het hele scherm. Kan bijsnijden.
Bevat	De hele afbeelding is zichtbaar, mogelijk met lege ruimte.

Herhaling

Optie	Wat het doet
Niet herhalen	Afbeelding verschijnt één keer.
Herhalen	Tegelt in beide richtingen.
Herhalen horizontaal	Tegelt alleen links-rechts.
Herhalen verticaal	Tegelt alleen boven-onder.
Ruimte	Tegelt met gelijke ruimte ertussen.
Afronden	Tegelt en schaalt zodat er geen ruimte overblijft.

Niet scrollen (fixed)

Zet aan als de achtergrond vast moet blijven staan terwijl de klant scrollt. Handig voor grote, paginavullende afbeeldingen.

Sectie 3 - Maatwerk CSS

Voor wie zelf wil stylen: schrijf eigen CSS in het Maatwerk CSS-veld. Deze CSS wordt op de checkout-pagina geladen en overschrijft de standaardstijlen.

Voor gevorderden

CSS is krachtig maar ook makkelijk stuk te krijgen. Test je wijzigingen eerst in een ander scherm voordat je ze op een live checkout toepast. Een foute regel kan je checkout er raar uit laten zien.

Opslaan

Klik onderaan op Opslaan. Je krijgt de melding "Het design is opgeslagen."

Upload je een bestand? Bij een volgende upload wordt het oude bestand automatisch vervangen. Een bestand verwijderen doe je via het prullenbak-pictogram naast de voorvertoning.