Docs

[bshum]

Hi
All of my images are displaying several pixel short of the container, so they’re not sharp. I’ve always wondered why my images look softer and lower quality than they should. Now I know why, but I can’t figure out how to fix it. I’ve attached screenshots.

The site is 900 pix wide but images on the blog are sized at 898.99 (using native WP gallery) or 883.99 (using Cornerstone to insert images onto page). On Woocommerce product pages, it’s even more pronounced, being 873.99 pixels wide.

Can you help me?

Thanks
Brian

[Prasant Rai]

Hello Brian,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[bshum]

Ooops! Sorry. It’s http://brianshumway.com/news

[Rue Nel]

Hello There,

Thank you for providing the url of your site. It seems that you are using Jetpack plugin. I would recommend that you disable the Photon module in your Jetpack settings. This would change the way your images will be displayed in your site. This module is the reason why it is not sharp.

Please let us know how it goes.

[bshum]

sweet. thank you!

[bshum]

it solved the blog issue, but turning of photon doesn’t seem to have resolved the issue for woocommerce. i’m still having a problem with woocommerce product images not displaying 100% page width. :/

[Thai]

Hi There,

Could you please provide the WooCommerce pages also?

Thanks.

[bshum]

this is one product page, but it’s the same on every product page. the image should be flush with the search tool icon.

http://brianshumway.com/fine-art-prints/baby-boy-sleeping-under-fly-net/

[Thai]

Hi There,

Please add the following CSS:

.woocommerce div.product .images {
    width: 100% !important;
}
.single-product .images img {
    width: 100%;
    height: auto;
}

Hope it helps 🙂

[Author]

Posts