Weird Issue with Woo Commerce Products

[starfox221]

Please see attached linked. The way that the products being displayed are causing issues with the row. On my other pages this is fine but when I try to use the Products ShortCode this is how it’s displayed. How can I resolve this?

Thanks

http://www.burnside360.com/fresh-fall-styles/

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Don’t use the woocommerce shortcodes, use the page builder instead

– Kyle

[starfox221]

Hi Kyle, unfortunately it’s the same result with the Page Builder too. Any other ideas?

[starfox221]

I also just updated to 3.2.3 as a precaution. Still no change.

Thanks

Geoff

[David Martin – Support]

Hi,

The culprit will almost certainly be the Autoptimize plugin your using. Please open it’s settings page and flush the it’s cache/data. Do this for any other cache plugins you use.

Thanks.

[starfox221]

Nope still no change. Disabled Auto Optimize after flushing the cache, then even flushed the W3 Total Cache. Still no change.

[jaussie]

I’m having this issue too and was doing a search for steps to resolve this.

It is only happening on the product page for one category, the other pages are fine.
As I couldn’t see an easy fix I deleted the element and did a new one and it worked, so perhaps delete it and do again?
Jaussie

[starfox221]

Hmm, what do you mean reset the element? You mean in the page builder?

Thanks

[David Martin – Support]

Hi,

Please test deactivate this plugin: Async Javascript.

If that yields no results, please deactivate all plugins leaving only WooCommerce active and re-test.

Thanks.

[starfox221]

I’m sorry but that’s actually the first thing I did. (If in doubt, deactivate all possible culprits) It doesn’t look like this this is an isolated issue, could you please check the CSS stylesheet to make certain that it’s working correctly?

Thanks

[starfox221]

An update: putting it into carousal mode, it works just fine. It only breaks when I put it into “Standard” mode.

[starfox221]

body .has-no-sidebar ul.products li.product {
    width: 186px;
    float: left;
}

@media only screen and (min-width: 1200px)
body.woocommerce .has-no-sidebar ul.products li.product, body.woocommerce .has-one-sidebar ul.products li.product {
    width: 250px;
}

@media only screen and (max-width: 991px)
body .has-no-sidebar ul.products li.product {
    width: 110px;
}

@media only screen and (max-width: 479px)
body .woocommerce-shop-page ul.products li.product, body .product_list_widget>div>ul.products li.product {
    width: 100% !important;
}

Using some of these has helped some of my issues but it still doesn’t look correct completely.

[starfox221]

Can someone please look into this further? You can see what I mean when you adjust the browser size to smaller viewports.

Thanks

[David Martin – Support]

Hi,

Can you please deactivate all plugins, leaving only WooCommerce active whilst we investigate further.

Thanks.

[starfox221]

This has been done. Please keep in mind that this is a live site while you’re digging through it. Let me know when you’re done and I’ll re-activate the plugins. Thanks