SLOW ADD TO CART – WHAT YOU THINK ABOUT THIS SOLUTION?

Artem, hi,

in Basel (www.independent.wine), “Add to cart” is super slow. It’s because it is waiting for Ajax request to complete (success).

So I and my dev came up with a workaround: instead of waiting for Success response from Ajax request, we force redirect to checkout page: window.location = wc_add_to_cart_params.cart_url;

It saves about 0.4s – feel much better. But do you thinik this solution is safe? Maybe there is a better solution?

File: wp-content/plugins/woocommerce/assets/js/frontend/add-to-cart.min.js
Code:

t.data.addToCartHandler.addRequest({
type: “POST”,
url: wc_add_to_cart_params.wc_ajax_url.toString().replace(“%%endpoint%%”, “add_to_cart”),
data: e,
success: function (t) {

},
dataType: “json”,
async: false
})
window.location = wc_add_to_cart_params.cart_url;

Hello,

Such an option already exists in WooCommerce Settings and you actually don’t have to customize the code. Just disable AJAX add to cart options and enable redirect to shopping cart in WooCommerce Settings.

Kind Regards

Artem, hi,

Actually, disabling AJAX in Woo creates a Fatal and freezes the “Add to cart” button. But we have developed a solution, and I want to share it with you – hope you will find it useful for you and other customers who use your wonderful theme!

– – –
OK, let’s start: If you disable Woo->Settings->Products->Enable AJAX, then the “Add to cart” button on the Single Product Page freezes – the wheel is spinning indefinitely.

In Chrome Console you see this Fatal error:

Uncaught ReferenceError: wc_add_to_cart_params is not defined
at HTMLFormElement.<anonymous> (functions.min.js?ver=5.4.2:488)
at HTMLBodyElement.dispatch (jquery.js?ver=1.12.4-wp:3)
at HTMLBodyElement.r.handle (jquery.js?ver=1.12.4-wp:3)
(anonymous) @ functions.min.js?ver=5.4.2:488
dispatch @ jquery.js?ver=1.12.4-wp:3
r.handle @ jquery.js?ver=1.12.4-wp:3

Not good 🙁 So, what’s the solution?

2) Update wp-content/themes/basel/js/functions.min.js
Replace this: url: wc_add_to_cart_params.wc_ajax_url.toString().replace(‘%%endpoint%%’, ‘basel_ajax_add_to_cart’),

With this: wc_add_to_cart_variation_params.wc_ajax_url.toString().replace(‘%%endpoint%%’, ‘basel_ajax_add_to_cart’),

Replace this: if (“yes” === wc_add_to_cart_params.cart_redirect_after_add) return void (window.location = wc_add_to_cart_params.cart_url);

With: return void (window.location = ‘/checkout/’);
(NB: I personally redirect to /checkout/, you can redirect to /cart/ if you want)

3) Disable setting:
Basel → Theme Settings → Product page → AJAX Add to cart OFF

4) Disable setting:
WooCommerce → Settings → Products → Enable AJAX add to basket buttons on archives OFF

5) Clear cache 🙂

Now, it works without errors in console. In general, I think it’s more reliable to change code in Basel rather than in WooCommerce, because new updates of Woo overwhite code and bring us back to where we started 🙂

Hope it helps! Have a nice day
Oleg

Hello,

This option conflict with our theme be fixed in our next theme update. Note that you will not have any errors in the console if you disable AJAX add to cart in both in WooCommerce and our theme. Then you don’t need to do any customizations in the code.

Kind Regards

[Author]

Posts