WooCommerce Checkout template without table breaks JS function

I changed the frontend templates (overriding by copying the file to my folder with custom themes) the cart and checkout pages replacing some constructions with table-row-columns-containers with div containers to create (in my opinion) a clearer layout, as well as to handle flexible changes layout.

It looks like the Wordpress hook / action woocommerce_checkout_order_reviewcalled from the template checkout/form-checkout.phpuses the code from cart/cart-shipping.php, which is great, because ist saves the list containing the selected delivery methods on both pages.

"Critical" change is to remove the tag tdand thand replace <tr class="shipping">on <div class="shipping">in cart/cart-shipping.php.

This leads to a problem:

Clicking on the shipping_methods ul list item triggers events update_checkoutand updated_checkoutwhich (I think) are responsible for updating the cart / chekout page. With modified HTML templates, everything does not work as it should; every time everything ulgets replicated. I could not find occurrences tr.shippingeither .shippingin woocommerce js code .

Why does the template structure that violates jQuery code change? And how can I achieve this change without breaking?

+4
source share
1 answer

, . , , ?

, , , ...

, assets/js/admin/meta-boxes-order.js tr.shipping from line 250-251 541, 786 874. , .

, ... , , div.shipping

, .

+1

Source: https://habr.com/ru/post/1688772/


All Articles