Woocommerce custom добавить в корзину кнопку ajaxify

Question

Я пытаюсь сделать цикл пользовательских продуктов Woocommerce. Но я застрял в том, как добавить кнопку add to cart button ajax type в цикл пользовательских продуктов. У меня есть страница магазина на моем веб-сайте, есть продукты, и эти продукты имеют add to cart button with ajax action, например, когда я нажимаю add to cart button, затем кнопка отключается, и справа от кнопки (внутри кнопки) появляется значок загрузчика, который вращается и после1 секунда этого процесса, моя корзина появляется. Я хочу то же самое, что и действие ajax добавить в корзину в моем цикле товаров. Я много искал, я нашел ответ, вот ссылка: https://stackoverflow.com/a/53015757/12199128. Это работает только на 50%, Это не отключает кнопку после нажатия на нее и не показывает значок загрузчика в кнопке, когданажав на кнопку
Вот скриншоты страницы моего магазина (не пользовательские):

Вот скриншот моего цикла продуктов:

А вот мой код:

<?php

$args = array(
        'post_type' => 'product',
        'showposts' => all,
        'orderby' => 'date',
        'order' => 'DESC',
);
$loop = new WP_Query( $args );

while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>

<div class="col-md-3 mb-3">
    <div class="card">
        <a href="" class="custom_image">
            <?php the_post_thumbnail( ); ?>
        </a>
        <?php woocommerce_show_product_sale_flash( $post, $product ); ?>
        <div class="card-body">
            <div>
                <a class="font-weight-bold" href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
                    <?php the_title(); ?>
                </a>
            </div>
            <span class="price pl-0"><?php echo $product->get_price_html(); ?></span>
            <div class="add-to-cart ">
                <?php 
                    echo sprintf( '<a href="%s" data-quantity="1" class="btn btn-md btn-primary btn-block mt-3 %s" %s>%s</a>',
                    esc_url( $product->add_to_cart_url() ),
                    esc_attr( implode( ' ', array_filter( array(
                        'button', 'product_type_' . $product->get_type(),
                        $product->is_purchasable() && $product->is_in_stock() ? 'add_to_cart_button' : '',
                        $product->supports( 'ajax_add_to_cart' ) ? 'ajax_add_to_cart' : '',
                    ) ) ) ),
                    wc_implode_html_attributes( array(
                        'data-product_id'  => $product->get_id(),
                        'data-product_sku' => $product->get_sku(),
                        'aria-label'       => $product->add_to_cart_description(),
                        'rel'              => 'nofollow',
                    ) ),
                    esc_html( $product->add_to_cart_text() )
                );
                ?>
            </div>
        </div>
    </div>
</div>

<?php endwhile; wp_reset_query(); ?>

И еще одна вещь, это не все продукты, 'showposts' => 12 <- работает, но <code>'showposts' => all <- не работает. <code>Please help me