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.
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;
}