Page 1 of 1

Blurry Images...

Posted: Sat Mar 27, 2010 4:58 am
by onlyme
Hi guys,

Ive tried all types of images, png, jpg, gif, 128bit, played with them in photoshop, etc etc yet theyre still appearing VERY BLURRED.

Can anyone help!? Im losing patience with this now!

Here is a link to an image to view it.

All images on the site are the same...you need to click enlarge it to see full effects of the burred-ness.

http://www.usbcameracables.co.uk/nikon- ... cable-lead

Re: Blurry Images...

Posted: Sat Mar 27, 2010 5:35 am
by rph
They look fine to me.

If you are having a lot of problems then make sure the original image size isn't smaller than 500 x 500. The more OpenCart has to enlarge the picture the worse it's going to look. If you need to you can control the popup size in System->Manage Stores->Edit->Image->Product Image Popup Size.

Re: Blurry Images...

Posted: Sat Mar 27, 2010 6:21 am
by onlyme
Hi Ryan

I did actually change that one after the post! Doh! For some reason that is what id say almost pin sharp now, but i saved it no differently to the original that was terrible.

E.g view this one, its not exactly 'pin sharp'

http://www.usbcameracables.co.uk/ds-dsl ... rger-cable

Have you any suggestions or would you be happy with that?

Re: Blurry Images...

Posted: Sat Mar 27, 2010 6:24 am
by basics
constrain proportions may be the issue

Ensure that the images are all the same size when uploading, then ensure you specify the correct image resize to avoid the blurred effect. This will take a little longer to sort but worth while.

1024x768 image can be resized to 800x600 600x450 400x300 and so on. By doing this it ensures the ratio and perspective of an image remain relative to that of the original image

Hope this helps
James

Re: Blurry Images...

Posted: Sat Mar 27, 2010 7:40 am
by rph
onlyme wrote:Have you any suggestions or would you be happy with that?
Doesn't look too bad. But like I said, make sure the originals aren't smaller than 500 x 500. If they are change the pop-up size.

I've been meaning to put together a mod that'll keep OpenCart from enlarging the image past a certain percentage (e.g. 125% of original) since this is a big problem I run into but I haven't gotten around to doing it.
basics wrote:1024x768 image can be resized to 800x600 600x450 400x300 and so on. By doing this it ensures the ratio and perspective of an image remain relative to that of the original image
OpenCart maintains perspective by inserting a solid color background (it's "invisible" in most cases since it's white).

Re: Blurry Images...

Posted: Sat Feb 18, 2012 11:40 pm
by azrinsani
Hi,

Has this problem been solved? I shrunk my image and the effect is blurry. The original image's sharpness and quality seems lost.
Can anyone help?

Thanks

Re: Blurry Images...

Posted: Sun Feb 19, 2012 12:37 am
by dimko
It might be due to a fact that OpenCart compresses the images when making images' cache. I don't know the compression level of it, but it might have something to do with it. Correct me if I'm wrong :)

Re: Blurry Images...

Posted: Fri Feb 24, 2012 7:22 pm
by azrinsani
Hi I've found out that this is due to JPEG Compression. If you use PNG image type there would be no problem

Re: Blurry Images...

Posted: Sat Nov 10, 2012 6:09 pm
by CatherineCS
I have the exact same problem. I've tried resizing the images to be the exact size/dimensions OpenCart wants, I've tried making them a .png like azrinsani said, I've tried everything! All of the images are professionally shot and crystal clear on my computer, but on the website they are fuzzy: spray tan solutions . Has anybody found a solution?

Re: Blurry Images...

Posted: Mon Mar 18, 2013 3:16 pm
by jadeye
Hello,

Did anyone resolve this??

I have the same problem.

Re: Blurry Images...

Posted: Tue Mar 19, 2013 2:51 am
by skunks
Same here problem...

Anybody???

Re: Blurry Images...

Posted: Tue Apr 22, 2014 4:43 pm
by Evans
Surely there must be a solution to this...I'm finding the same problem. I've tried uploading to the same dimensions images are set in OC and using .png , but they are still not crisp as the original.

Re: Blurry Images...

Posted: Tue Apr 22, 2014 11:39 pm
by rph
Make sure you're not using small images. They should be the same size as your Product Image Popup Size setting (500 x 500 in default settings).

Re: Blurry Images...

Posted: Tue Jul 15, 2014 10:16 pm
by Dhaupin
Old thread but one possible solution is to change the jpg quality to 100% in system/library/image.php since you are already using compression at image creation level

Heres a VQ

Code: Select all

	<file name="system/library/image.php">

		<operation info="sets 100 percent quality for jpg" error="log">
			<search position="replace"><![CDATA[public function save($file, $quality = 90) {]]></search>
			<add><![CDATA[public function save($file, $quality = 100) {]]></add>
		</operation>

	</file>
Also make sure your CSS isnt sizing down/up the region the image is going into. In certain images, a rescale browser side increases blurryness obviously.

Re: Blurry Images...

Posted: Fri Mar 20, 2015 10:38 am
by rijichouno
Dhaupin wrote:Old thread but one possible solution is to change the jpg quality to 100% in system/library/image.php since you are already using compression at image creation level

Heres a VQ

Code: Select all

 <file name="system/library/image.php">

 <operation info="sets 100 percent quality for jpg" error="log">
 <search position="replace"><![CDATA[public function save($file, $quality = 90) {]]></search>
 <add><![CDATA[public function save($file, $quality = 100) {]]></add>
 </operation>

 </file>
Also make sure your CSS isnt sizing down/up the region the image is going into. In certain images, a rescale browser side increases blurryness obviously.
Where and how can I implement this code? Thank you.

Re: Blurry Images...

Posted: Tue Feb 21, 2017 3:14 pm
by pepperr
Dhaupin wrote:
Tue Jul 15, 2014 10:16 pm
Old thread but one possible solution is to change the jpg quality to 100% in system/library/image.php since you are already using compression at image creation level

Heres a VQ

Code: Select all

	<file name="system/library/image.php">

		<operation info="sets 100 percent quality for jpg" error="log">
			<search position="replace"><![CDATA[public function save($file, $quality = 90) {]]></search>
			<add><![CDATA[public function save($file, $quality = 100) {]]></add>
		</operation>

	</file>
Also make sure your CSS isnt sizing down/up the region the image is going into. In certain images, a rescale browser side increases blurryness obviously.
Not working they stay the same blurry qality.