Hi thanks for a great theme! I recently setup our site with MaxCDN and integrated into W3TC plugin. I read thru your documentation carefully — making sure to only use for page cache, not JS minify or anything else.
After implementing the CDN, I next tried using a plugin called Imsanity to optimize all my images. Somehow once I regenerated all my images, it seems to have broke my CSS. Especially the woocommerce product image sizes.
Our site is http://www.askdrmaxwell.com
Can you please take a look at the homepage (towards the bottom) there are 5 products, and they are supposed to be all next to each other in one row.. however now the spacing is all jumbled and not right.
Also on any individual product page, the images are now much too large! I’ve tried to set woocommerce product size in woocommerce settings.. and then use regenerate thumbnails plugin, and also reset cache. However, this does not fix the issue.
Can you please help?
Thanks again!
James
Hi,
Please use this ccs to fix the products on your homepage: http://screencast.com/t/Q7Tp39wVxq
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
float: left !important;
clear: none !important;
margin: 0 3.8% 2.992em 0 !important;
}
.woocommerce ul.products li.last, .woocommerce-page ul.products li.last {
margin: 0px !important;
}
And this for your products page: http://screencast.com/t/foUFhqva
.woocommerce #content div.product div.images, .woocommerce #content div.product div.summary, .woocommerce div.product div.images, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.images, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.images, .woocommerce-page div.product div.summary {
float: left !important;
width: 48% !important;
}
woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
margin-right: 20px;
}
Hope this helps!
Thanks
Thanks! That worked, I appreciate your help!!
One last thing — the links at the top header are showing in grey. How can I just change them to black? I tried the following CSS but it doesn’t seem to work:
.top-header-menu li a, .td-header-menu-wrap .menu-post-and-page-settings-container .menu li a {
color: #000000;
padding: 0px 15px 0px 15px;
}
Thoughts? Thanks again for the great support
James
Hi,
Please use this css for your top menu: http://screencast.com/t/dBEIorEbdg
.menu-top-container .top-header-menu li a{
color: #000000!important;
padding: 0px 15px 0px 15px;
}Thanks!
Hi — sorry to bug you on the same issue again, however I have a related problem.
I just noticed I am having the same formatting issues on my main shop page: http://www.askdrmaxwell.com/shop
Also having the issue on category pages, such as: http://www.askdrmaxwell.com/product-category/adrenals/
Thanks for your help!
James
Hi,
I see that some how the same css is loaded two times: http://screencast.com/t/LC417O6y and because of that the products list results in that way because when you remove the first percentage width all aligns well: http://screencast.com/t/8ThCjmN2t
Please try to remove manually any custom css added that add’s that width to products list like shown in the screenshot.
Thanks
Hi Lucian,
Thanks for your recommendations. I have tried to eliminate the issue manually via custom CSS.. however, even if I remove all CSS in the custom css area, the problem remains.
Any other ideas?
Thanks for your help.
James
Hi,
Please use this custom css in Theme Panel > Custom css: http://screencast.com/t/CvHsyJgJepj
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
width: 22.05% !important;
}
Result:
http://screencast.com/t/C7WJasUT
http://screencast.com/t/F3y3h146YMP
Thanks!
I just tried this fix and it completely broke my site somehow! I even reverted right back to my old custom CSS and it is still broken.. see screenshot below:
https://www.dropbox.com/s/kwu5npbvp203izi/nope.png?dl=0
Please help!!
Ah nevermind .. got it fixed! Some coincidence with our CDN I guess! Works fine now.
Last thing, is that now on the mobile version it doesn’t look right… any ideas?
Thanks for all your help. You guys are awesome!
James
Hi,
Here it is display on mobile: http://screencast.com/t/QqpRL0RKX
On tablet view I found a issue: http://screencast.com/t/2sVRlecUd
But is solved by this css code: http://screencast.com/t/3ZFKr5WEG6o
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product:nth-child(5) {
clear: both !important;
}
Thanks!
Hi thanks again for a great theme!
I’m having the same issues again with the CSS on my site.. if you check http://www.askdrmaxwell.com you’ll see that the footer where I have product thumbnails is not showing correctly. It should be the 5 thumbnails in one row… not two rows. Can you please help with the CSS to correct it?
I’m not quite sure why this formatting issue keeps happening… I have not changed the CSS at all.
Thank you for your help!
James
Hi,
I have checked your site and did not found any issues there: http://screencast.com/t/twSw8Xwhi
Thanks!
Hi Alin,
Thanks for your help! For some reason, I keep getting all kinds of CSS errors which just pop up at random.
If you check these links, you will see that the shop products are not displaying correctly:
http://www.askdrmaxwell.com/shop/page/2/
http://www.askdrmaxwell.com/shop/page/3/
Can you please advise on how to fix these shop pages?
Thank you,
James
Hi,
I’m not sure what’s happen. Did you removed the above css? As I did not find it applied or overwrote on your page: http://screencast.com/t/AdEh5IYM
.woocommerce-page ul.products li.product:nth-child(5) {
clear: both !important;
}
Hope this helps!
Thanks Alin!
