# Variable Product Issue

**URL:** <https://forum.pinegrow.com/t/variable-product-issue/7836>\
**Category:** Beginners\
**Tags:** woocommerce\
**Created:** [March 20, 2023, 5:40am UTC](https://forum.pinegrow.com/t/variable-product-issue/7836 "2023-03-20T05:40:37Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Plunky](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/plunky/32/5705_2.png) [@Plunky](https://forum.pinegrow.com/u/Plunky)\
**Post date:** [March 20, 2023, 5:40am UTC](https://forum.pinegrow.com/t/variable-product-issue/7836/1 "2023-03-20T05:40:37Z")

</div>

Hi, I have a problem in correctly configuring the “ **Product Add to Cart** ” action in **Freestyle mode**. Basically, when I go to select the options of a variable product and try to add it to the cart I get “Choose product options by visiting…”. **The products are configured correctly**. If I remove the theme I created and use for example twentytwenty3 the problem does not appear.

I’ve tried watching the dedicated [tutorial on Youtube](https://www.youtube.com/watch?v=0ZalExUpa68), I’ve tried using the code provided in the “_StarterShop\_BS5\_Finished-main_” project, I’ve tried having a look on the [forum](https://forum.pinegrow.com/t/add-to-cart-with-variable-product-issue/6673) for useful topics but nothing, I couldn’t solve my problem in any way.

I read on this forum that the structure must be well set up otherwise Woocommerce can’t recognize the section and you have problems with woocommerce js.

I literally copied the 2 forms realtive to simple and variable product, but it doesn’t seem to work. In my project I am using Tailwind. Since I can’t come up with any way, is it possible to ask for a working code example for tailwind? Simple products work correctly, only with variable ones I have problems.

---

<div class="post-metadata">

**Author:** ![Plunky](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/plunky/32/5705_2.png) [@Plunky](https://forum.pinegrow.com/u/Plunky)\
**Post date:** [March 20, 2023, 1:01pm UTC](https://forum.pinegrow.com/t/variable-product-issue/7836/2 "2023-03-20T13:01:05Z")

</div>

I hope it can be helpful to someone:

I solved this problem simply by turning on the option _ **Use WordPress jQuery script** _ in the tab _WordPress panel_ \> _Theme / Plugin settings_

 ![woocommerce-variable-product-issue](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/b/b64741f3c6630c1fe857d2f3ca3557dc21604a67.png)

---

<div class="post-metadata">

**Author:** ![madjedo](https://avatars.discourse-cdn.com/v4/letter/m/cc9497/32.png) [@madjedo](https://forum.pinegrow.com/u/madjedo)\
**Post date:** [March 20, 2023, 4:40pm UTC](https://forum.pinegrow.com/t/variable-product-issue/7836/3 "2023-03-20T16:40:07Z")

</div>

You can also opt-out using freestyle for atc button. The freestyle looses alot of accessibility features and you will probably have plugin incompatibilites with plugins like color swatches or tracking pixels…

---

<div class="post-metadata">

**Author:** ![Plunky](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/plunky/32/5705_2.png) [@Plunky](https://forum.pinegrow.com/u/Plunky)\
**Post date:** [March 21, 2023, 12:03am UTC](https://forum.pinegrow.com/t/variable-product-issue/7836/4 "2023-03-21T00:03:53Z")

</div>

For accessibility, there should be no problem since the on-screen printed html of the various components is identical in both Freestyle and Hooks modes.  
What concerns me is compatibility with other plugins/tracking.

What do you think is the best approach? Do you think one should use Hooks mode and then maybe add the changes by creating plugins?  
I say this because Hooks mode imposes limits on how new elements can be arranged and added within the page