WooCommerce Product Page One Column & Glitching

Support
#1

Hello,

After the update the product detail page is all messed up and is only one column instead of 2. Please look at the following product and screenshot:

https://www.tlvbiblesociety.org/store/messianic-jewish-family-bible

How can we fix this?

#2

I made sure I am only running woocommerce 3.6.5 btw.

#3

I figured out this has to do with combining CSS. Is there a CSS exclude file I can use to prevent this?

#4

I believe I found the file to exclude:

/wp-includes/css/dist/block-library/theme.min.css

It appears to have fixed this issue for that particular product but other products are still messed up.

#5

It looks like I am having the same issue that I am having with deferred JS in one of my other threads:

Everytime I load the page, the minified/combined CSS has asset fingerprinting and is thus different everytime. This is what Litspeed Cache Wiki says:

CSS Excludes
If you enabled minification, combination or push for CSS in the Optimize tab, you may exclude some CSS here. Use this space to list any CSS files (one per line) you would like excluded from the optimization functions. You may enter full URLs or a partial string. There’s no need to use wildcards in partial strings.

#6

Hi Joseph,

Have you tried disabling the cache plugin and see if the issue is still there? If the glitch is not there anymore then it is safe to say that the issue is caused by the caching. Try to exclude this css folder/file /wp-content/themes/pro/framework/dist/css/* or /wp-content/themes/pro/framework/dist/css/site/woocommerce/integrity-light.css.

If it still doesn’t solve the issue, please share to us a credential to your site in a secure note so we can look a bit closer.

Thanks!

#7

Unfortunately, This did not solve the issue. As far as I can tell, there is nothing I can do since I cannot enable a wildcards. I can only target specific files.

#8

Hi Joseph,

Please exclude the following files:

/wp-content/themes/pro/cornerstone/assets/dist/js/site/cs-head.{autonumber}.js
/wp-content/themes/pro/cornerstone/assets/dist/js/site/cs-body.{autonumber}.js
/wp-content/themes/pro/framework/dist/js/site/x.js?ver=3.0.1

… where {autonumber} is whatever number you’ll see when you view the source code of the page.

#9

Hi Benursal,

Is {autonumber} actually used in the name of the file?

#10

Hey Joseph,

The {autonumber} will depend on what is loaded on your site when you view the code of your page. You can easily do that by visiting the page and then right-click anywhere on the page.

Before doing it, you must temporarily deactivate the LiteSpeed Cache and any plugin that minify the html of the page and combined the JS scripts so that you will see all the original file resources of the site.

Hope this helps.

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.