Question 253307 in Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Woocommerce – triggering quick view on add to cart button click based on woodmart theme

I would like to change add to cart button on woodmart theme to quick view.
Here is my code but it does not work.
Any help is appreciated.

My code so far:

function woodmart_trigger_quick_view_on_add_to_cart()
{
// Check if WooCommerce is active
if (!class_exists('WooCommerce')) {
    return;
}

// Enqueue jQuery script
wp_enqueue_script('jquery');

// Output the JavaScript code
?>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        $('.add_to_cart_button').on('click', function(event) {
            event.preventDefault();

            var quickViewButton = $(this).closest('.product').find('.quick-view-button');

            if (quickViewButton.length > 0) {
                setTimeout(function() {
                    quickViewButton;
                }, 0);
            }
        });
    });
</script>
<?php
     }
Tags:

2

Answers


  1. 0

    I have revisited your code nearly completely and managed to fix your issues.
    The revisited code is:

    /*JavaScript code for triggering quick view on add to cart button click*/
function woodmart_trigger_quick_view_on_add_to_cart()
{
    // Check if WooCommerce is active
    if (!class_exists('WooCommerce')) {
        return;
    }

    // Enqueue jQuery script
    wp_enqueue_script('jquery');

    // Output the JavaScript code
    ?>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            // Handler for "Add to Cart" button click
            $('.add_to_cart_button').on('click', function(event) {
                event.preventDefault(); // Prevent the default behavior of the button click

                var quickViewButton = $(this).closest('.product').find('.quick-view-button');

                if (quickViewButton.length > 0) {
                    setTimeout(function() {
        // Trigger the click event on the quick view button after a short delay
                        quickViewButton.trigger('click');
                    }, 0);
                }
        // Stop the propagation of the add to cart action
                return false;
            });
        });
    </script>
    <?php
}

// Hook the JavaScript code to the wp_footer action
add_action('wp_footer', 'woodmart_trigger_quick_view_on_add_to_cart')

    ;

    Login or Signup to reply.
  2. 0

    Almost, but doesn’t work with ajax filters. When filter is added, it reverts to default behaviour again.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search