Variable Product Issue

[Plunky]

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, I’ve tried using the code provided in the “StarterShop_BS5_Finished-main” project, I’ve tried having a look on the forum 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.

[Plunky]

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

[madjedo]

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…

[Plunky]

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