WooCommerce velden aanpassen op de afrekenpagina

Ben je niet tevreden met de velden die op de afrekenpagina van je WooCommerce webshop staan?

Weet je niet over welke velden ik het precies heb? Denk aan velden als bedrijfsnaam, toevoeging, bestelnotities en eigenlijk alle andere velden die je bij het afrekenen ziet staan.

Met behulp van een plugin kun je deze afrekenvelden in WooCommerce aanpassen, terwijl alles verder goed blijft werken. Ideaal dus om van overbodige velden af te komen of om extra velden toe te voegen.

Video: WooCommerce velden aanpassen

In onderstaande video laat ik je alle mogelijkheden zien om velden in WooCommerce uit te schakelen, toe te voegen of aan te passen.

Abonneer je op mijn YouTube kanaal

Heb je meer behoefte aan de uitleg in tekst of wil je nog meer informatie over dit onderwerp? Geen enkel probleem, je kunt hieronder verder lezen.

Waarom de WooCommerce velden aanpassen?

Het kan zijn dat je je afvraagt waarom je de WooCommerce velden zou willen aanpassen. Dit kan meerdere redenen hebben, want geen enkele webshop is natuurlijk hetzelfde.

Wat nou als je bijvoorbeeld alleen digitale producten verkoopt? Een telefoonnummer en de adresgegevens van een klant heb je dan eigenlijk niet noodzakelijk nodig.

Het kan ook zijn dat je mensen niet de mogelijkheid wilt geven om een bedrijfsnaam in te vullen, een toevoeging bij het adres (wordt niet vaak gebruikt) of de bestelnotities.

Wat ook het geval kan zijn, is dat je juist meer velden wilt toevoegen aan de afrekenpagina. Zo kan je bijvoorbeeld een klant de mogelijkheid willen geven om aan te geven of het pakket in de ochtend of middag bezorgd mag worden.

Tot slot kan je ook iets simpels willen als dat bepaalde velden de volledige breedte innemen of juist dat je twee velden naast elkaar wilt hebben staan.

Hoe je WooCommerce velden kunt aanpassen

Om velden aan te passen op de afrekenpagina van je WooCommerce webshop kun je de plugin Checkout Field Editor gebruiken.

Met deze plugin kun je velden toevoegen, bewerken en verwijderen. Naast de standaard tekstvelden heb je ook de mogelijkheid om mensen iets te laten selecteren, checkboxen te maken of een datumprikker toe te voegen.

Wanneer je de plugin hebt geïnstalleerd en geactiveerd kun je naar “WooCommerce -> Checkout Fields” gaan om de WooCommerce velden aan te passen. De pagina waar je aanpassingen kunt doen ziet er als volgt uit.

Checkout Field Editor pagina

Zoals je ziet staan hier meteen alle velden die je op de afrekenpagina ziet staan bij factuurgegevens. Onder Shipping Fields kun je de verzendgegevens bekijken en bij Additional fields de velden die onder Extra informatie staan.

WooCommerce veld verwijderen

Wanneer je een veld als “toevoeging (optioneel)” wilt verwijderen van de afrekenpagina, dan kun je dit doen door een vinkje te zetten bij het veld en op “Disable/Remove Checked” te klikken.

WooCommerce veld verwijderen van de afrekenpagina

Vervolgens zal het, zoals je hierboven in de afbeelding kunt zien, doorgestreept worden en is het niet meer zichtbaar op de afrekenpagina zodra je op “Save Changes” hebt geklikt.

WooCommerce veld toevoegen

Stel je wilt een extra veld onder het kopje “Extra informatie” op de afrekenpagina toevoegen, dan kun je dit bereiken door bovenaan op het tabblad “Additional Fields” te klikken en vervolgens op “+ Add field”.

WooCommerce veld toevoegen

Er verschijnt nu een lege rij die je volledig naar wens kunt invullen. Bij Name kun je een willekeurige naam invoeren. Type is belangrijk, want je kunt hier aangeven wat voor veld je wilt hebben. Je kunt kiezen voor een tekstveld, wachtwoord veld, tekstgebied, keuzeveld, multi-keuzeveld, checkbox of datumprikker.

Bij Label kun je invoeren wat de bezoekers boven het veld te zien krijgen en bij Placeholder / Option Values kun je een tekst plaatsen met een voorbeeld wat er ingevuld kan worden in het veld.

Wil je dat het veld de linkerkant, rechterkant of volledige breedte in beslag neemt? Je kunt dit aangeven bij Position door voor left, right of full-width te kiezen. Wanneer je twee velden naast elkaar hebt staan, dan kun je bij het laatste veld die de rij afmaakt Clear Row aanvinken. Het eerstvolgende veld zal dan netjes op een nieuwe regel komen te staan.

Bij Valitidation Rules kun je onder andere aangeven of het veld verplicht is. Wanneer het om een e-mailveld gaat kun je ook aangeven dat er gecontroleerd moet worden dat het om een e-mailadres gaat en bij een telefoonnummer of er wel een nummer is ingevuld.

Tot slot heb je de Display Options. Je kunt hier aangeven of de gegevens die in het veld zijn ingevuld ook in de e-mails naar de klant moeten staan en of het op de detailpagina van de bestelling moet worden weergegeven.

Dit waren alle dingen die je kunt invullen. Ik hoop dat het een beetje duidelijk is, maar ik zal nog even een voorbeeld geven. Wanneer je een klant de mogelijkheid wilt geven om een bezorgdatum te kiezen, dan kun je het volgende invullen.

Bezorgmoment kiezen WooCommerce

Het enige wat ik heb ingevuld is een naam, type (date picker), placeholder en positie. Het ziet er vervolgens zo uit op de website.

Voorkeur bezorgdatum

Wanneer je op “kies een bezorgmoment” klikt komt er een datumprikker tevoorschijn, zodat er een datum geselecteerd kan worden. Heel moeilijk is het dus gelukkig niet en er zijn heel veel velden te verzinnen die je zou kunnen maken.

WooCommerce velden resetten

Wil je om wat voor reden dan ook weer terug naar hoe de WooCommerce afrekenpagina er standaard uitziet? Er is een reset knop in deze plugin gebouwd om dit voor elkaar te krijgen.

Ga naar “WooCommerce -> Status -> Tools”. Je zal hier een kop “Checkout field” tegenkomen, met daarnaast de knop “Reset Checkout Fields”.

Reset WooCommerce velden

Klik op deze knop om alle wijzigingen die je hebt gedaan ongedaan te maken en weer terug te gaan naar de standaard WooCommerce velden op de afrekenpagina.

84 reacties add your comment

  1. Hoi Maikel,

    Thanks voor het filmpje. Heel duidelijk. Waar ik zelf naar opzoek ben is het aanpassen van de kop ‘Factuurgegevens’ hier zou ik graag ‘Afleveradres’ hebben. Wij hebben een bezorgdienst dus als iemand leest factuuradres kan dat voor verwarring zorgen. Weet jij of dat mogelijk is?

    Groetjes

  2. Hi Maikel,

    Fijn deze heldere uitleg, ik heb inmiddels de plugin checkout field editor ingesteld. Maar ik zit nog met de volgende vraag: zodra ik een product aanklik, en hij naar de productpagina gaat, krijg ik vervolgens het blokje waarin je meer en minder aantallen in kunt geven voor dat product. Hij laat nu de aantallen niet zien, omdat er 2 pijltjestoetsen in dat blokje staan, precies voor het aantal. Dit doet hij ook op de winkelmand pagina. Het liefst zou ik de pijltjes toetsen helemaal uitschakelen, maar ik kan nergens ontdekken waar. Weet jij hoe ik dit kan oplossen? Hoe deze aantallen in ieder geval zichtbaar zijn, nu zijn ze echt verstopt achter die pijltjes toetsen.

    Dank je wel alvast!

    Gr. Alieke

  3. Hi Maikel,
    Dank voor je duidelijke uitleg. Ik heb een simpele vraag over de kleur van de prijs op de bestelpagina. Deze kan ik nergens aanpassen en is niet duidelijk. Heb ik daar een aparte plugin voor nodig?

    Alvast bedankt
    Lia

  4. Hoi Maikel,

    Fijne uitleg steeds! Ik heb er veel aan!
    Ik kwam bij dit artikel omdat ik graag een veld wil toevoegen aan de afrekenpagina, namelijk een optie waarbij mensen kunnen kiezen voor het wel/niet toevoegen van een persoonlijk geboortekaartje, tegen een bepaalde prijs. Mij leek het handig om de afrekenpagina te kiezen, maar ik weet niet of je daar nog een betaald product kan toevoegen. Kan dit? Anders zal ik het denk ik op een andere manier moeten oplossen?

    Dankjewel!

  5. Hi Maikel,

    Is er een mogelijkheid om na het invullen van het factuuradres door te klikken naar verzendadres en dat er op die pagina dan een vinkje staat die de klant zou kunnen aan klikken, waar op staat factuur adres zelfde als verzend adres? zodat de klanten niet twee keer het zelfde adres hoeven in te vullen?

    Met vriendelijke groet,
    Anne

    • Je kunt instellen dat het factuuradres standaard ook het verzendadres is, tenzij iemand een vinkje zet dat het anders moet zijn. Dit lijkt mij een betere optie. Je kunt dit instellen door naar “WooCommerce -> Instellingen -> Verzendmethoden -> Verzendopties” te gaan. Je kunt dan bij Bestemming van de verzending kiezen voor “Standaard naar klant factuuradres”.

      • Hi Maikel,
        Ik heb het vinkje aangezet “standaard naar klant verzendadres” (stond op factuuradres) maar bij bestellen krijg ik geen mogelijkheid om ander verzendadres op te geven. Ik heb alles uit de winkelmand gehaald en opnieuw besteld maar krijg geen vinkje voor ander verzendadres. Alvast bedankt

        • Standaard zou het er dan horen te staan. Wanneer dit niet het geval is, zullen er ook andere aanpassingen gedaan zijn om dit onzichtbaar te maken. Ik kan je helaas niet zonder het zelf te zien vertellen hoe en wat, aangezien ik niet weet wat er gewijzigd is.

  6. Het zal met cookies onthouden worden in de browser, dus je zal de cookies hiervoor moeten uitschakelen. Ik heb dit nog nooit hoeven te doen, dus ik kan je niet vertellen waar. Is voor mij net zoveel uitzoekwerk.

  7. Goedemorgen!
    Fijne uitleg. Dank!
    Nog een vraag: Op het moment dat mensen terugkomen voor een tweede bestelling blijven alle gegevens van de eerste bestelling ingevuld staan. Hoe kan ik er voor zorgen dat na afrekenen al die velden gewist worden?
    Grt, Marco

  8. Bij mijn woo commerce heb ik onder het formulier met gegevens een automatisch hokje aangevinkt staan met de tekst: Subscribe to our newsletter ik kan nergens vinden waar ik dit weg kan halen. Ik heb namelijk onderin de pagina al de checkboxen staan die ik nodig heb in samenwerking met emailresponder.

  9. Goedemiddag, hoe kan ik het vinkje ‘verzenden naar een ander adres?’ uitzetten? Deze staat nu automatisch aangevinkt waardoor de checkout pagina onnodig lang is.
    Groetjes

    • Bij WooCommerce -> Instellingen -> Verzendmethoden -> Verzendopties kun je bij “Bestemming van de verzending” kiezen voor “Standaard naar klant factuuradres”. Het zal dan niet meer automatisch aangevinkt zijn.

      Let op. Het kan zijn dat de pagina voor jou in de cache staat. Haal alle items uit je winkelmand, voeg iets opnieuw toe en bekijk het dan nog een keer om te controleren of de aanpassing werkt.

  10. Hallo,

    Ik kom er maar niet achter waarom mijn velden in woocommerce op de afreken pagina maar ook bij de custom options zwart blijven, ik kan er op klikken en typen maar is niet echt zichtbaar zeg maar.
    Hoop dat je mij kan helpen.

    Gr Mandy

  11. Hallo Maikel,
    Weet niet goed of ik mijn vraag bij dit topic kan plaatsen. Ik kan helaas geen artikel over vinden. Bij het testen van mijn woocommerce afrekenformulier vul ik een straatnaam in Amsterdam in, met plaatsnaam Amsterdam uiteraard. Dan selecteer ik bij Land België (wat natuurlijk fout is), en plaats ik de bestelling. Vervolgens wordt dit niet als fout gezien en gaat het formulier gewoon door naar de betaling…

    Het gekke is dat dit bij sommige landen wel en bij andere landen niet gebeurd (i.c.m. Amsterdam). Wellicht heb je een idee hoe ik dit kan oplossen? Dank!

    • Ik denk dat je een andere plugin gebruikt dan die in dit artikel beschreven wordt, daar er alleen een betaalde versie van is. Ik weet niet of de andere plugin het kan of dat het alleen in de pro versie zit.

  12. Hallo Maikel,
    Op mijn website heb ik meerdere betaalmethoden. Op dit moment is de methode ‘Overboeking’ automatisch aangevinkt. Ik wil graag dat iDeal al automatisch aangevinkt is. Hoe verander ik dit?

    Bij voorbaat dank,

    • De bovenste optie staat standaard aangevinkt. Je zal iDEAL dus bovenaan moeten zetten. Wanneer iDEAL al bovenaan staat en er staat iets anders aangevinkt, dan komt dit omdat je deze optie zelf als laatste gekozen hebt tijdens een bestelling en het onthouden is.

  13. Goedemorgen,

    Enig idee hoe je een berekend/samengesteld veld kunt maken. Stel: je hebt drie velden: straat, huisnummer, huisnummertoevoeging. Die worden alle drie ingevuld en vervolgens wil je daar een samengesteld veld van maken, ook in het afrekenscherm. In Excel of een database zou de formule zijn: ‘Straat’&” “&Huisnummer&” “&Huisnummertoevoeging

    • Nee, hier kan ik je helaas momenteel niet bij helpen. Vroeger ging dit eenvoudiger, maar tegenwoordig wordt alles los getoond en heb ik dit nog niet hoeven uit te zoeken. Je zou een mailtje naar de makers van de plugin kunnen sturen om erachter te komen.

  14. Hoi,
    Ik vraag me af of het ook mogelijk is om door middel van CSS velden netjes uit te lijnen op de check-out pagina. Ik werk met het thema The7 en krijg het maar niet gedaan. Plugin al gebruikt om velden aan te passen maar ook dat doet niets. Enige tips zijn welkom 🙂 Bedankt voor het meedenken. Mvg Aletta

  15. Hoi!

    Weet je of het mogelijk is om, aan een bepaald product, nog een invulveld toe te voegen op de checkout pagina?

    Ik hoor het graag!

    • Nee, je kunt niet specifiek instellen dat er iets per product getoond moet worden. Is er een reden dat je het op de afrekenpagina wilt? Op de productpagina zelf zijn er wel manieren om een extra veld te creëren.

  16. Hi Maikel,

    Waar ik tegenaan loop is dat er een stomme tussenpagina komt als mensen een product toevoegen aan winkelmand. Ze blijven dan op de pagina (zelfde URL) maar er verschijnt alleen een tekst bovenin “Product X is toegevoegd aan Winkelmand” + button Winkelmand bekijken

    Dat valt niet echt op en mensen lopen hier vaak vast (omdat ze denken dat het fout gaat). Hoe kan ik deze pagina bewerken tot iets beters? Kan ik er niet handmatig een eigen pagina tussenzetten of ze desnoods meteen naar winkelmatjes sturen? (ze kopen toch altijd maar 1 product)

    Check een van mijn producten als voorbeeld: https://www.blogkracht.nl/product/google-in-een-dag/

    Thanks en keep up the good work!

    Bastiaan

    • Ja, het is mogelijk om de mensen direct door te sturen naar de winkelmand pagina. Je doet dit door naar WooCommerce -> Instellingen -> Producten te gaan en een vinkje te zetten bij “Na succesvolle toevoeging gelijk doorsturen naar de winkelmandpagina”.

  17. Beste Maikel,

    Ik heb een custom field gemaakt voor een referentienummer en een bestelnotitie. Is het mogelijk deze ook op te nemen in bv de factuur/pakbon/bestelbevestiging?

    • In de bestelbevestiging wordt dit volgens mij standaard automatisch opgenomen ook en anders zal er zeker een mogelijkheid zijn. Voor je factuur en pakbon weet ik het niet zeker, het hangt er vanaf hoe de plugins samenwerken.

  18. Hoi, ik heb iets raars, misschien weet je de oplossing. Als je een product bestelt, en komt dan op de winkelmandpagina, dan staat het aantal op 2. dit krijg ik niet meer veranderd. En ook het verwijderen van de hele bestelling lukt niet. Heb je enig idee waar deze fout zit en hoe ik het kan herstellen?

    Groetjes, Nicolette

  19. Hoi hoi,

    Bedankt voor je heldere uitleg. Het is me gelukt, alleen lukt het nog steeds niet om de tekst “view cart” in het Nederlands te krijgen.
    Weet jij hoe ik dit eenvoudig kan aanpassen zonder in html te sleutelen?

  20. Beste Maikel,

    Kun je met de plugin Checkout Field Editor alleen velden aanpassen of ook buttons. Ik kan met geen mogelijkheid de tekst van de button “continue to payment” veranderen. Ook niet met de plugin “Woocommerce Customizer”. Voordat ik de plugin ga kopen wil ik het graag zeker weten. Mijn webshop staat nog offline. Ik hoop dat je kunt helpen.

    Mvg, Anneke

    • Nee, dit heeft geen invloed op de buttons. De tekst van de buttons kun je vertalen via het thema als deze de plugin overschrijft, wat vermoedelijk het geval is omdat je het over een Engelse tekst hebt.

  21. Hi Maikel, lijkt mij een prima plugin voor ook een prima prijs. Echter heb ik een andere uitdaging 🙂 Wellicht dat jij het antwoord weet? En of deze plugin dit kan ondervangen.

    Voor een nieuw project http://www.ballondeal.nl proberen wij ballondecoratie via een webshop te verkopen. Nu willen wij ons beperken tot bepaalde postcodes. Nu heb ik verschillende zones aangemaakt en reeksen toegevoegd met alleen cijfers.

    Nu kunnen klanten niet de verzendkosten berekenen als zij hun volledige postcode invullen. Is dit probleem te tackelen met deze plugin? Gr. Wouter

  22. Hi! Super uitleg! Heb nog wel een vraagje, waar kan ik de standaard tekst ‘Ik ga akkoord met de Algemene Voorwaarden’ aanpassen? Zou deze tekst iets meer willen uitbreiden?
    En hoe kan ik hier nog een extra optie toevoegen voor het inschrijven van de nieuwsbrief?

  23. Ik zoek eigenlijk de mogelijkheid om in het rekenveld het woord belasting te veranderen naar btw 21%. Is dit ook mogelijk?

    • Ja, dit is mogelijk. Je moet hiervoor naar “WooCommerce -> Instellingen -> Belasting -> Standaardtarieven” en dan kun je bij “Belastingnaam” de naam aanpassen naar btw 21%.

  24. Goedenavond,
    Waar vind ik de afrekenpagina? ik heb hem eerst gevonden en aangepast, maar nu zie ik dat de velden weer wél verplicht zijn.

    • De exacte url hangt van je website af, dit kun je namelijk aanpassen. Je kunt er echter altijd komen door het proces door te lopen waar een klant ook doorheen moet. Een product in het winkelmandje doen en vervolgens naar de afrekenpagina.

      • Hallo,

        Ik ben bezig met het instellen. Maar als ik een product in het winkelmandje leg, Dan kom ik op een lege pagina terecht en kan ik mijn winkelwagentje helemaal niet bekijken.Hoe kan ik dit oplossen?

        Alvast bedankt,
        Inge

  25. Beste Maikel,

    Super bedankt alvast voor de duidelijke uitleg!
    Ik wil op mijn afrekenpagina de vraag ‘hoe heeft u ons gevonden?’ toevoegen met voorgeselecteerde antwoorden. Kun jij mij uitleggen hoe ik dat doe? Ik heb een WordPress site met Woocommerce.

    Alvast bedankt voor het meedenken.

    Groet,
    Saskia Looij

    • Ik zou dit eerlijk gezegd niet vragen wanneer iemand wilt afrekenen. Iemand uit het afrekenproces halen met een extra vraag zal niet conversieverhogend zijn.

      Mocht je het toch nog willen, dan zou je bij type moeten kiezen voor een
      multi-keuzeveld en bij label kun je dan de vraag stellen.

  26. Heey, allereerst: bedankt voor alle duidelijke info en uitleg die je steeds geeft, super! Ik heb een vraag: ik heb woocommerce/ideal in de testfase. Als ik een virtuele download bestel gaat alles goed. Na de betaling (zit ik nog steeds in de afrekenen pagina trouwens) ziet alles er ook prima uit; ik kan het product downloaden, alle adres en andere gegevens staan erop. Alleen er staat ook een knop ‘opnieuw afrekenen’ bij. Dat vind ik erg verwarrend voor toekomstige klanten. Als je die indrukt ga je inderdaad weer naar de winkelmand, ligt het product er nog/weer in en lijkt het dus alsof de bestelling niet goed is gegaan. Weet je hoe ik die knop weg kan krijgen?

  27. Hey, hele duidelijke video. Ik zie dat jij aan de rechterkant van de afrekenpagina de ‘Jouw bestelling’ hebt staan. Bij mij staat het eronder. Kun je aangeven hoe dat kan worden aangepast?

  28. Hallo,

    Omdat het mij niet lukte om de velden aan te passen heb ik de plugin aangeschaft en ook deze kan de placeholders niet aanpassen. Placeholders blijven engelstalig.
    Enig idee?

    Hartelijke groet,

    Sjoerd Banga

  29. Hi! Handig om te weten.
    Kan het kloppen dat je alleen met de betaalde versie velden naast elkaar kan zetten en velden echt definitief kan verwijderen? Ik heb nu een gratis versie van de plugin en daar lijken niet alle opties in te zitten (of ik kan ze niet vinden) 🙂
    Thanks!

  30. Goedemorgen,
    Hoe kan ik de tekst ‘Ik ga akkoord met de algemene voorwaarden’ boven de knop afrekenen wijzigen?
    Ik vind de tekst nergens terug

  31. Op de afreken pagina staat bij de betaalmogelijkheid “Paypal” achter het Paypal logo de tekst: ” Wat is Paypa?l”. Deze tekst is door woorcommerce gegenereerd. Ik zoek me suf, maar enig idee waar ik die tekst kan verwijderen? (het is geen instelling, helaas voorziet de plugin als hierboven ook niet in).
    Dank
    MvG
    Michgel

    • Wellicht kun je het weghalen met CSS, dat kan ik echter alleen zien als ik de website zie. Een andere optie is in elk geval om de vertaling in WooCommerce aan te passen, want dit zal erin staan als deze tekst door WooCommerce wordt gegenereerd. Je kunt de vertaling aanpassen met behulp van een plugin als Loco Translate.

  32. Goedemorgen, onder welke naam kan ik de plugin om velden aan te passen in WooCommerce terug vinden? Met de zoekterm “woocommerce velden aanpassen” wordt ‘ie niet gevonden…

    Martine

Geef een reactie