Add to cart button for Vertical and Horizontal results

WooCommerce - Add to cart button for Vertical and Horizontal results

While there is no option to display an add to cart button, you can use a custom function to do so.

What is this, and where do I put this custom code?

add_filter('asp_results', 'asp_add_to_cart_data', 1, 1);
function asp_add_to_cart_data($results) {
    $product_add_to_cart_text   = 'Add to cart';
    $variation_add_to_cart_text = 'Choose variation';   // Leave it empty to not display at all
    
    if (class_exists("WooCommerce")) {
        $_pf = new WC_Product_Factory();
        foreach ($results as &$r) {
            if (
            $r->content_type == "pagepost" &&
                in_array($r->post_type, array("product", "product_variation"))
            ) {
                $product = $_pf->get_product($r->id);
                $is_variable = $product->is_type( 'variable' ) || $r->post_type == 'product_variation';
                $link = !$is_variable ? get_permalink(wc_get_page_id('shop')) : $product->get_permalink(); 
                $ajax = !$is_variable ? ' ajax_add_to_cart' : ''; 
                $text = !$is_variable ? $product_add_to_cart_text : $variation_add_to_cart_text;
                if ( empty($text) )
                    continue;
                ob_start();
                ?>
                <div class="woocommerce">
                    <a href="<?php echo $link; ?>"
                       data-quantity="1"
                       class="button product_type_simple add_to_cart_button<?php echo $ajax; ?>"
                       data-product_id="<?php echo $r->id; ?>" data-product_sku=""
                       rel="nofollow"><?php echo $text; ?></a>
                </div>
                <?php
                $button = ob_get_clean();
                $r->content .= $button;
            }
        }
    }
    return $results;
}
add_action('wp_footer', 'asp_add_to_cart_handler');
function asp_add_to_cart_handler() {
    ?>
    <script>
    jQuery(function(t){if("undefined"==typeof wc_add_to_cart_params)return!1;var a=function(){t(".asp_r").on("click",".add_to_cart_button",this.onAddToCart).on("click",".remove_from_cart_button",this.onRemoveFromCart).on("added_to_cart",this.updateButton).on("added_to_cart",this.updateCartPage).on("added_to_cart removed_from_cart",this.updateFragments)};a.prototype.onAddToCart=function(a){var o=t(this);if(o.is(".ajax_add_to_cart")){if(!o.attr("data-product_id"))return!0;a.preventDefault(),o.removeClass("added"),o.addClass("loading");var r={};t.each(o.data(),function(t,a){r[t]=a}),t(document.body).trigger("adding_to_cart",[o,r]),t.post(wc_add_to_cart_params.wc_ajax_url.toString().replace("%%endpoint%%","add_to_cart"),r,function(a){a&&(a.error&&a.product_url?window.location=a.product_url:"yes"!==wc_add_to_cart_params.cart_redirect_after_add?t(document.body).trigger("added_to_cart",[a.fragments,a.cart_hash,o]):window.location=wc_add_to_cart_params.cart_url)})}},a.prototype.onRemoveFromCart=function(a){var o=t(this),r=o.closest(".woocommerce-mini-cart-item");a.preventDefault(),r.block({message:null,overlayCSS:{opacity:.6}}),t.post(wc_add_to_cart_params.wc_ajax_url.toString().replace("%%endpoint%%","remove_from_cart"),{cart_item_key:o.data("cart_item_key")},function(a){a&&a.fragments?t(document.body).trigger("removed_from_cart",[a.fragments,a.cart_hash,o]):window.location=o.attr("href")}).fail(function(){window.location=o.attr("href")})},a.prototype.updateButton=function(a,o,r,e){(e=void 0!==e&&e)&&(e.removeClass("loading"),e.addClass("added"),wc_add_to_cart_params.is_cart||0!==e.parent().find(".added_to_cart").length||e.after(' <a href="'+wc_add_to_cart_params.cart_url+'" class="added_to_cart wc-forward" title="'+wc_add_to_cart_params.i18n_view_cart+'">'+wc_add_to_cart_params.i18n_view_cart+"</a>"),t(document.body).trigger("wc_cart_button_updated",[e]))},a.prototype.updateCartPage=function(){var a=window.location.toString().replace("add-to-cart","added-to-cart");t(".shop_table.cart").load(a+" .shop_table.cart:eq(0) > *",function(){t(".shop_table.cart").stop(!0).css("opacity","1").unblock(),t(document.body).trigger("cart_page_refreshed")}),t(".cart_totals").load(a+" .cart_totals:eq(0) > *",function(){t(".cart_totals").stop(!0).css("opacity","1").unblock(),t(document.body).trigger("cart_totals_refreshed")})},a.prototype.updateFragments=function(a,o){o&&(t.each(o,function(a){t(a).addClass("updating").fadeTo("400","0.6").block({message:null,overlayCSS:{opacity:.6}})}),t.each(o,function(a,o){t(a).replaceWith(o),t(a).stop(!0).css("opacity","1").unblock()}),t(document.body).trigger("wc_fragments_loaded"))},new a});
    </script>
    <?php
}

..and use this custom CSS code for some basic formatting:

div.asp_r.asp_w .asp_content a.add_to_cart_button,
div.asp_r.asp_w .asp_content a.added_to_cart {
    display: none;
    padding: 10px 15px !important;
    bottom: 5px;
    right: 5px; 
    z-index: 10000000;
    position: absolute;
    line-height: 13px;
}

div.asp_r.asp_w .asp_content a.added_to_cart {
    bottom: 5px;
    right: 126px; 
    background: white;
}

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 1024px) {
    div.asp_r.asp_w .asp_content a.add_to_cart_button {
        display: block !important;
    }
}

div.asp_r.asp_w .asp_content:hover a.add_to_cart_button,
div.asp_r.asp_w .asp_content:hover a.added_to_cart {
    display: block;
}