WPLounge
WooCommerce afrekenpagina
Home » Tutorials » Tips om je WooCommerce afrekenpagina te optimaliseren

Tips om je WooCommerce afrekenpagina te optimaliseren

WooCommerce is een veelzijdige en krachtige plugin waarmee je van je WordPress website eenvoudig een mooie en veelzijdige webshop maakt. Wat echter een belangrijke factor is, is dat het afrekenproces snel en goed verloopt. Een moeizaam afrekenproces is een grote afknapper en één van de belangrijkste reden voor het verlaten van de winkelwagen.

Affiliate disclaimer:
In onze artikelen en op onze pagina's staan affiliate links. Wanneer je via één van deze links een aankoop doet, ontvangen wij een (meestal kleine) commissie van de verkoper. Wij geven altijd onze eerlijke mening over producten. Klik hier voor meer informatie.

In dit artikel bespreken we de verschillende mogelijkheden om het afrekenproces aan te passen.

Direct naar de afrekenpagina

In WooCommerce begint het standaard afrekenproces bij het toevoegen van producten aan de winkelmand. Vervolgens moet de klant handmatig naar de winkelmand gaan om uiteindelijk op de afrekenpagina te kunnen komen om de bestelling te plaatsen. Zoals je ziet, zijn dat flink wat stappen, en veel gebruikers willen niet zo’n omslachtig proces doorlopen. Hiermee verlies je veel potentiële verkopers, gelukkig is het echter vrij makkelijk om het afrekenproces duidelijker en eenvoudiger te maken.

TIP VAN WPLOUNGE
Divi theme & Divi Builder
Bij Elegant Themes ontvang je meer dan
85 premium WordPress themes (waaronder Divi!) voor maar 89 dollar!

Bekijk de themes »»
Lees meer over Divi.

Hoe kan je de winkelmandpagina uitschakelen?

Er zijn verschillende opties om de winkelmandpagina van WooCommerce niet te gebruiken. Zo kan je dit in de instellingen van WooCommerce aangeven, de winkelmand uitschakelen met behulp van een plugin of door het toevoegen van code snippets. Laten we de verschillende opties eens bekijken.

De winkelmandpagina uitschakelen met WooCommerce

Volg de volgende stappen om de winkelmand uit te schakelen via de WooCommerce instellingen:

  • Ga in de WordPress dashboard naar WooCommerce > instellingen
  • Klik op producten > algemeen
  • Selecteer ‘Na een succesvolle toevoeging gelijk doorsturen naar de winkelmandpagina
Winkelmandpagina

Hierna ga je naar ‘Geavanceerd > pagina instellingen‘ Zet hier de winkelmandpagina op ‘Afrekenen‘ en klik onderaan de instellingen op ‘wijzigingen opslaan‘.

Dat is alles! Klanten zullen nu direct naar de afrekenpagina gaan om de bestelling te voltooien.

De winkelmand uitschakelen met een plugin

Instantio Winkelmandpagina plugin

Een andere optie is om te kiezen voor de plugin Instantio – Direct checkout for WooCommerce. Naast het deactiveren van de winkelmandpagina, zijn er nog veel meer mogelijkheden met deze plugin. Zo wordt de pagina niet opnieuw geladen bij het afrekenen. De klant kan dus een product direct bestellen en afrekenen op dezelfde pagina. Met behulp van de plugin is het mogelijk om binnen 15 seconden een product te bestellen! De plugin is beschikbaar in verschillende talen waaronder Nederlands.

Prijs: $29 | Meer info

De winkelmand uitschakelen met code snippets

Een andere optie is om de winkelmandpagina met code snippets uit te schakelen. Hiervoor gaan we het bestand functions.php bewerken. Het is wel aan te raden om hiervoor een child theme te gebruiken. Wanneer er geen child theme gebruikt wordt gaan alle aanpassingen na de volgende update van het thema verloren!

Voordat je aan de slag gaat met code snippets is het verstandig om eerst een goede backup van de website te maken.

In het WordPress dashboard ga je naar Weergave > Theme editor. Kies het bestand functions.php en voeg de volgende code toe:

add_filter('add_to_cart_redirect', 'ql_skip_cart_page');
function ql_skip_cart_page () {
 global $woocommerce;
 $redirect_checkout = $woocommerce->cart->get_checkout_url();
 return $redirect_checkout;
}

Vergeet niet om na het toevoegen van deze code snippet het bestand op te slaan door op ‘Bestand bijwerken‘ te klikken.

Winkelmand overslaan

Vervang de tekst ‘In winkelmand

Nu we de winkelmand niet meer gebruiken, heeft de tekst onder ieder product ‘In winkelmand‘ ook niet zo veel zin meer. Het is dus een goed idee om deze tekst te veranderen in ‘Nu bestellen‘ of ‘Bestellen‘.

In winkelmand

De tekst kunnen we vervangen met de volgende code in functions.php:

/* vervang tekst winkelmand */
add_filter( 'woocommerce_product_single_add_to_cart_text', 'ql_replace_add_to_cart_button_text' );
add_filter( 'woocommerce_product_add_to_cart_text', 'ql_replace_add_to_cart_button_text' );
//Vervang Add to Cart text met Nu Bestellen! 
function ql_replace_add_to_cart_button_text() {
 return __( 'Nu bestellen', 'woocommerce' );
}

Na het opslaan van het bestand functions.php ziet de pagina er als volgt uit:

Nu bestellen

Verwijder het bericht ‘Toegevoegd aan winkelwagen‘.

Iedere keer dat een klant een product koopt verschijnt de volgende melding “Uw product is aan de winkelwagen toegevoegd“. WordPress zou WordPress niet zijn als dit ook niet aan te passen is! Gebruik de volgende code-snippet in het functions.php bestand om de melding uit te schakelen:

/* melding uitschakelen: toegevoegd aan winkelwagen */
add_filter( 'wc_add_to_cart_message_html', 'ql_remove_add_to_cart_message' );
function ql_remove_add_to_cart_message( $message ){
 return '';
}

Winkelmand verwijderen uit het menu

De meeste webshops beschikken over een link in het menu naar de winkelwagenpagina zodat klanten de winkelwagen kunnen controleren. Aangezien we de winkelmand niet meer gebruiken, is het logisch om dit menu item te verwijderen. Om dit te doen ga je naar: Weergave > menu’s en selecteer ‘winkelmand‘. Klik hier op verwijderen en op menu opslaan om het menu item te verwijderen.

Al deze kleine aanpassingen helpen om de webshop te optimaliseren en bezoekers een betere aankoopervaring te bieden.

Winkelmandfunctionaliteit toevoegen aan de afrekenpagina

Nu de winkelmand ‘weg’ is slaan klanten veel extra stappen over voordat zij daadwerkelijk kunnen bestellen. Maar nu valt wel de functionaliteit weg voor klanten om hun bestelling aan te passen. Klanten kunnen namelijk niet meer hun bestelling aanpassen in de afrekenpagina.

Om dit probleem te verhelpen kan je de winkelmandpagina samenvoegen met de afrekenpagina, zodat klanten toch nog hun bestelling kunnen aanpassen. Zo behoudt de klant alle functionaliteiten, maar hoeven zij minder stappen te doorlopen. 

Als je de afrekenpagina gaat bewerken klik je op het blauwe plusje en voeg je het shortcode-contentblok toe. Voeg de shortcode [woocommerce_cart] toe om de winkelmandpagina samen te voegen met de afrekenpagina.

De afrekenpagina aanpassen

Ben je benieuwd hoe je de vormgeving van je afrekenpagina kan aanpassen? Bekijk dan mijn video tutorial hierover!

Tot slot

Een duidelijk afrekenproces is erg belangrijk voor iedere webshop. Door het verwijderen van de winkelmand versnel je het afrekenproces en dit help aanzienlijk om de conversiepercentages te verhogen! Hoe minder stappen er nodig zijn bij het plaatsen van een bestelling, hoe groter de kans dat een klant tot aankoop overgaat.

Beoordeel dit artikel

Mark Hagendijk

Mark biedt technische ondersteuning voor WordPress. Zo nu en dan maakt hij graag tijd vrij om een bijdrage te leveren aan WPLounge.

Reageer