# Trouble with Variable Product "Add to Cart"

**URL:** https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880
**Category:** WooCommerce
**Created:** [September 1, 2022, 6:53pm UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880 "2022-09-01T18:53:42Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![iamrobbie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/iamrobbie/32/4694_2.png) [@iamrobbie](https://forum.pinegrow.com/u/iamrobbie)
#### Post date: [September 1, 2022, 6:53pm UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880/1 "2022-09-01T18:53:42Z")

</div>

Hi there!

I’m new to the world of Pinegrow and I’m trying _really_ hard to create a WooCommerce theme.

I’ve watched the tutorial at least a dozen of times now, but it seems every time I fix one error, another appears.

Here’s the current issue:

When I select my variations, and click the “Add to Cart” button, WooCommerce generates the following error:

```auto
Cookie Count and Chocolate Level are required fields

```

This issue persists even though I’m clearly selecting the variations. Any ideas as to what might be causing this problem?

Any help would be very much appreciated!

 ![Screen Shot 2022-09-01 at 2.46.22 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/6/6a30313c7457ce46c0588df6231ed3f23341afcc.jpeg)

---

<div class="post-metadata">

### Author: ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)
#### Post date: [September 3, 2022, 2:17pm UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880/2 "2022-09-03T14:17:43Z")

</div>

@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](mailto:support@pinegrow.com).

---

<div class="post-metadata">

### Author: ![iamrobbie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/iamrobbie/32/4694_2.png) [@iamrobbie](https://forum.pinegrow.com/u/iamrobbie)
#### Post date: [September 5, 2022, 10:30am UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880/3 "2022-09-05T10:30:07Z")

</div>

@matjaz - Thanks for the reply!

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!

---

<div class="post-metadata">

### Author: ![Emmanuel](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/emmanuel/32/6294_2.png) [@Emmanuel](https://forum.pinegrow.com/u/Emmanuel)
#### Post date: [September 5, 2022, 12:17pm UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880/4 "2022-09-05T12:17:59Z")

</div>

@iamrobbie

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)

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/7/7a46c97739725301d7dcd5de7aeecb91f09209b7.png)

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. 😉

---

<div class="post-metadata">

### Author: ![iamrobbie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/iamrobbie/32/4694_2.png) [@iamrobbie](https://forum.pinegrow.com/u/iamrobbie)
#### Post date: [September 5, 2022, 2:51pm UTC](https://forum.pinegrow.com/t/trouble-with-variable-product-add-to-cart/6880/5 "2022-09-05T14:51:56Z")

</div>

Thanks, @Emmanuel. I still have a lot to learn…
