Can’t click Add to card (cross-selling product) on checkout page

[perlfan]

Hi,
I’ve defined one cross-selling product that shall appear to customers on the checkout page (I’ve attached the link to that product). The cross-selling product appears correctly during checkout, however I cannot click Add to cart. On the shop page “Add to cart” works for that product though.
Thanks for help. Frank

[David]

Hi there,

i am not seeing the Cross Sell for the product you have linked us to ?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[perlfan]

Hi David – I wasn’t clear enough with my request. Now I updated the link which now shows a product with the only cross sell product in the bottom. On the product page, you can add the cross sell product, but not in checkout… this is my problem. Frank

[David]

That product is listed as an Upsell – which only displays on the Single Product.
See here for reference:

https://docs.woocommerce.com/document/related-products-up-sells-and-cross-sells/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[perlfan]

In my browser (FF) I see the cross sell product also in checkout: https://1drv.ms/u/s!AozyLumA02R5y8hdk3bM6l8BF4OBwQ?e=2KpjRO

And there I can’t click the Add to cart button…

[David]

The Woocommerce Upload Files plugin is adding this CSS:

/* Drag & Drop won't work otherwise */
.cart-collaterals {
	pointer-events: none;
}
.woocommerce-cart .cart-collaterals .cart_totals table, .wc-proceed-to-checkout, .woocommerce .cart_totals, .checkout_coupon, .cart-update-buttons, 
.checkout-button, .cart-collaterals button, .cart-collaterals input, .cart_totals input, #shipping_method input
{
	pointer-events: all;
}
/* */

Which disables the pointer events on all Pages then re-enables them on the Cart and Checkout…. However your cart page is not the default Woo cart page so it remains disabled.

You can use this CSS to target your custom cart page and fix the issue:

.page-id-3352 .cart-collaterals {
    pointer-events: all;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[perlfan]

I would have never found this out on my own, thank you so much!

[David]

You’re welcome

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts