WooCommerce Variable Product Price & Add Variable to Cart

[powrider686]

Hi there,
I am trying to use the Layout Builder to create a product layout. I started with the template provided with photo on left and product info on right. This looks great, but I am unable how to figure out how to show the variable product options. I found the {{dc:woocommerce:product_price_html}} to properly display the variable price options, but I cannot figure out how to enable the variable option choice. When you add to cart, the lowest priced option is added, without a way to select which version you are selecting. How could I resolve this issue?

Secondly, I am using the Product Gallery Element for the photo on the left side of the page, but the gallery images aren’t showing. How could I fix that problem?

You can see the variable product here - https://rebeccabourke.wpengine.com/product/mothers-love/

Thanks for the help!

[ruenel]

Hello @powrider686,

Thanks for writing in!

Since you have variable products, you need to use the “Add to Cart Form” WooCommerce dynamic element in your custom single product layout.

Kindly let us know how it goes.

[powrider686]

Ok. I will try that. Would that option also allow the use of Subscriptions? How can I style that to look similar to how it does now? The style control isn’t very granular in that element.

What about the Product Gallery images? I can’t get any of them to show up either.

Thank you!

[ruenel]

Hello @powrider686,

You can use the “Product Gallery” WooCommerce dynamic element to display the product gallery images. As long as you use the “Add to Cart Form” element, it will always display the prices, variations, etc in the product page. Styling the individual elements in the Add to Cart Form will need to use custom CSS to be able to style or change its appearance.

Best Regards.