Tagged: catch responsive, images, pictures, resolution
- This topic has 3 replies, 2 voices, and was last updated 8 years, 7 months ago by Sakin.
-
AuthorPosts
-
July 25, 2015 at 12:57 am #61492timpMember
Happy Friday!
I am trying to figure out what is causing the images to show up blurry on mom’s site. The images clear up when you click on them and view them alone.
Is there a specific resolution I can have her scale them to to prevent this? If so, any program that you’d suggest that is easy to use?
Thank you so much!Tim
July 25, 2015 at 5:30 am #61512SakinKeymaster@timp: It depends on the image that you are uploading. So, can you be more specific on which image is blurry and also send me the URL of clear image. So, that I can check in. If you are talking about image in slider. Then the images, that you have uploaded in blurry. Check your original image:
http://www.blossomsbarn.com/wp-content/uploads/2013/05/herb-goats-milk-soap.jpg
http://www.blossomsbarn.com/wp-content/uploads/2015/04/blossoms-barn-shop-copy.jpg
http://www.blossomsbarn.com/wp-content/uploads/2014/10/TubTreats-slider.jpgThere is no such recommendation for image resolution. Higher the resolution, clearer the image looks but again slower your website will be as higher resolution image size are big for site to load fast. So, you need to find the balance between it.
September 3, 2015 at 12:22 am #65906timpMemberSorry, I was referring to the main shots on the product pages, as well as the spill page below them.
ex:http://www.blossomsbarn.com/product/roses-n-cream/
I suppose grainy would be a better word to describe them. You can see there is an issue with the main product shot, because when you click on it, you see the clear image.
http://www.blossomsbarn.com/wp-content/uploads/2013/05/Roses-n-Cream.jpg
The square shots of the other products below seem even grainier that the one above, but the originals are appear clear when you view them alone.Thanks so much.
Tim
September 3, 2015 at 6:22 pm #65981SakinKeymaster@timp: That is not theme issue, it’s your setting in WooCommerce plugin. For that go to “WooCommerce => Settings => Products => Display” and then change “Catalog Images, Single Product Image and Product Thumbnails” image sizes. See this http://docs.woothemes.com/document/using-the-appropriate-product-image-dimensions/
So for Single Product Image, you need to use image size of width at least 640, for Catalog Images, you need to use image size of width at least 560 and for Product Thumbnails, you need to use image size of width at least 300. After you change this, you need to regenerate your thumbnail using Regenerate Thumbnail http://wordpress.org/plugins/regenerate-thumbnails. So, that all your old product will have new image sizes.
-
AuthorPosts
- The topic ‘Blurry images :(’ is closed to new replies.