Estoy creando una página de pago en Wordpress con Woocommerce y me gustaría cambiar la posición de este cupón
Intenté usar jQuery para agregar la clase de cupón .woocommerce-form-coupon-toggle al ID de la tabla de revisión de pedidos, pero la clase no se agrega, y si llamo a la función en el archivo order-review.php, se me da error
mi código:
add_filter( 'woocommerce_checkout_order_review', 'add_class_element'); function add_class_element() { ?> <script type="text/javascript"> jQuery(function($) { $('#order_review ').addClass('woocommerce-form-coupon-toggle'); }); </script> <?php } add_filter( 'woocommerce_checkout_order_review', 'add_class_element');
También intenté crear una función jQuery en un archivo externo y llamarla en functions.php:
function ws_add_class_to_order_review() { wp_register_script( 'custom_script', get_template_directory_uri() . '/assets/js/main-navigation.js', array('jquery'), '1.0' ); wp_enqueue_script('custom_script'); } add_action('wp_enqueue_scripts', 'ws_add_class_to_order_review');
En main-navigation.js:
jQuery( document ).ready( function() { jQuery( '#order_review' ).addClass( '.woocommerce-form-coupon-toggle' ); } );
¿Hay alguna forma de que pueda agregar la clase de cupón al elemento de la página? o llamarlo de otra manera?
El script en su main-navigation.js es correcto, pero necesita agregar un evento adicional porque Woocommerce actualizará el div en #order_review por AJAX cuando se actualicen los precios (cuando el cliente actualice la dirección de envío/cambie el método de envío...) .
Puede agregar usar el evento updated_checkout
como este
jQuery( '#order_review' ).addClass( '.woocommerce-form-coupon-toggle' ); jQuery(document.body).on('updated_checkout', function(){ jQuery( '#order_review' ).addClass( '.woocommerce-form-coupon-toggle' ); });