• Spring naar de hoofdnavigatie
  • Door naar de hoofd inhoud
  • Spring naar de eerste sidebar

WPX - WordPress Expert

WordPress Development, Onderhoud & Hosting

  • WordPress Website
  • Woocommerce webshop
  • WordPress Onderhoud
  • WordPress Hosting
  • Portfolio
  • Over
  • Contact

Update WooCommerce cart automatisch bij wijzigen aantallen

Home / Code Snippets & Tutorials / WooCommerce / Update WooCommerce cart automatisch bij wijzigen aantallen

De button waarmee je de aantallen in je WooCommerce winkelwagen kan bijwerken zorgt regelmatig voor verwarring. Zou het niet beter en logischer zijn als bij het wijzigen van de aantallen de cart automatisch wordt bijgewerkt?

WooCommerce winkelwagen

Dit is mogelijk met een aantal regels code. Als eerste verbergen we de ‘winkelwagen bijwerken’ button met wat regels CSS. Deze regels kan je toevoegen aan de stylesheet van je WordPress thema of via de WordPress customizer.

.woocommerce button[name="update_cart"],
.woocommerce input[name="update_cart"] {
	display: none;
}

Het is belangrijk dat de button niet volledig wordt verwijderd omdat de verbonden is met de JS trigger die uiteindelijk de aantallen in de WooCommerce cart bijwerkt.

Als tweede stap voeg je onderstaande script toe aan je WordPress thema.

var timeout;
 
jQuery( function( $ ) {
	$('.woocommerce').on('change', 'input.qty', function(){
 
		if ( timeout !== undefined ) {
			clearTimeout( timeout );
		}
 
		timeout = setTimeout(function() {
			$("[name='update_cart']").trigger("click");
		}, 1000 ); // 1 second delay.
 
	});
} );

Maak je gebruik van een child thema dan kan je bovenstaande script toevoegen door gebruik te maken van wp_enqueue_script(). Bij sommige WordPress thema’s zoals het Genesis Framework is het ook mogelijk om een stukje code toe te voegen aan de head of footer sectie via de thema opties.

Maak je geen gebruik van het Genesis Framework en wil je niet de code van je thema aanpassen dan kan je de plugin Insert Header and Footers installeren. Deze plugin is makkelijk in gebruik waardoor je eenvoudig bovenstaande code kan toevoegen aan je website.

Over Frank Schrijvers

Hey! Ik ben Frank, digitale duizendpoot en fulltime WordPress developer. Ik ben het hart en de ziel van WPX. Ik ontwikkel maatwerkwebsites, managed WordPress websites en zorg voor supersnelle hosting.

sidebar

sidebar-alt

Wordpress of Woocommerce hulp nodig?

Wil jeje website aanpassen of een nieuwe site laten ontwikkelen?

Contact opnemen
  • Over WPX
  • Code & Tutorials
  • Algemene voorwaarden
  • Privacy policy
  • Password Generator
  • MD5
  • Contact

© 2022 · WPX · vermelde prijzen zijn exclusief BTW.

Deze website gebruikt cookies om je gebruikservaring te optimaliseren en om webverkeer te analyseren. Lees meer