@iamrobbie WC Add to cart for variants is very sensitive to the correct HTML structure of the section. Elements must be wrapped and arranged correctly. Otherwise the WC JS code doesn’t work.
PG Add To Cart action gives some guidance but it is easy to make a mistake.
Please double-check the structure, and in case it doesn’t help, paste the HTML code for the Add To Cart section from PG here, or send the project to support@pinegrow.com.
Luckily, I was able to figure it out… after several days of struggling.
Now, my next challenge is figuring out why some of my CSS properties are being overwritten when I add WP actions (e.g., the color of my Product Search button)
I would LOVE to see more tutorials from you. A full build from start to finish would be great!
First of all, here is a useful tip that doesn’t only concern the use of WooCommerce but all WordPress smart actions.
To troubleshoot your creations, never hesitate to analyze the code produced by Pinegrow in your template (you can do it from Pinegrow, or directly by analyzing the exported PHP template file from your theme folder)
Then, never hesitate to use the inspector of your browser to see if your CSS is well loaded.
If the CSS reference is not visible on your element (or if your element does not have exactly the structure you gave it in Pinegrow), chances are that the smart action has overwritten the content of your element by obliterating all the CSS properties you had set in Pinegrow.
Because in fact, depending on the type of action, the export/result will replace the element OR will replace the content or will be positioned before or after the targeted element (if you use the standard actions, you can define this choice)
In some cases, it will be necessary to create specific CSS rules to target what is inside your containers.
That’s it. Do not hesitate to tell me if I have not been clear enough in my explanation.
