Woocommerce Full-Width Images?

Looks like they're using javascript to calculate the height of the top section. However, that wouldn't work if their images were as big as yours. Have you tried reducing the height of your images?

I did reduce my image size, but I would have to reduce them a lot more to get the Add To Cart above the fold. Not sure how much I'm willing to compromize on image size just to have the button at the bottom, especially if there's still a chance it will appear below the fold. If it's between adding JS libraries or putting the Cart back where it was, I'll settle for putting it back. Probably better for conversions anyhow.

Okay... so ONE last question and then I'm done...

Is there a way I can change the BG color on individual product pages?

I'd like to try having a different color BG for each product. The only way I can think to do this is by manually adding the color via CSS and targeting the Post-ID of each page. This would totally work, but it would eventually add a TON of CSS as more products get published. Is there an easier, more efficient method?

Yea that's the only way to achieve it for sure.

I compromised on the colour backgrounds for products - so they vary depending on the Product Category. Every shop product and every product page can be targeted with this CSS which is automatically added by WOO to the body of the page - which is great as you can style anything on the page with it:

product_cat-<category-name>

On the shop page each of your listings also has the product_tag-<tag-name> added.

Thanks Leo, that's what I figured.

That's a good idea David. I might try that.

No problems - Coulter. It's a great method - my products, headers and footer backgrounds are all coloured accordingly with very little code - but the current never ending store development only has three categories!

Tom - i never liked the shortcode i wrote for adding the 'add to cart' button, the code's good for description etc but not nice for the button. My PHP is very limited, would you know how to use a do_action to call the button in within the shortcode? A bit of a mash-up between mine and your methods.

Might be worth a new topic - you want to take the core WC function that outputs the button, and place it within a shortcode?

Hi Tom, yes - ill start a new Topic, wasn't sure if it would be of interest to Coulter. He can keep an eye out for it.

Coulter, on another point regarding fixing items to the bottom of the viewport. I solution i have used is to set the parent DIV to height of the viewport using:

height: calc(100vh - 100px); /* The 100px is the height of the header etc and you'll need to add prefix versions.

Then you can fix the element to the bottom of the div with bottom: 0;

Not sure if you can make it work with the CSS hack on Woo but would be interesting to see.