Site logo

Archived topic

add_to_cart shortcode in Query Loop

3 replies · Started by Luca on August 29, 2022

Viewing posts 1–4 of 4

Hi, I'm trying to create a completely new shop page for WooCommerce.
I'm using Query Loop to insert products, but I'm unable to insert the button "Add to Cart", specific for each product.
I'm using shortcode add_to_cart but it works blank, if I insert a product id, this obviously remains the same for all products and not product-specific.

Hi Luca,

Just realized that the add to cart button can’t be added currently in the Query Loop Block.

What you can do for now is to use the WooCommerce module to show the items you intend to show, and the we can try using custom CSS to alter the look/layout of your shop.

Reference: https://docs.generatepress.com/article/woocommerce-overview/

Hello,

I need also to display products with Query loop in content pages, with the "add to cart" button.

Beginning of a solution...

I created a grid of products manually (without loop) with this button :
<a class="gb-button add_to_cart_button ajax_add_to_cart" href="#" data-product_id="1">Add</a>

Note : I looked at GP code (Shop page) and I took some elements to avoid a reload (and I delete href="?add-to-cart=1")
> class : "add_to_cart_button ajax_add_to_cart"
> data : "data-product_id"

It works well (except that I don't have the nice bar that appears at the top indicating that the product is well added, compared to GP Shop page)

My question :

Is there a way to create this button in a Query loop with "generateblocks_query_loop_args" or something else ?
> Add a custom attribute with the product ID variable : "data-product_id = id"

I am so close and at the same time so far from finding a solution 😭!! It would be great to create custom product listings using Query loop 🤩

Thanks for your help

Hi there,

unfortunately that is not possible at this time.
We are looking at how to integrate Woo products for a future GB Pro update, but we're not there yet.

This archived topic is closed to new replies.