Blurry thumbnails using image helper

Permalink 1 user found helpful
Has anyone had any issues with blurry thumbnails from the thumbnail helper? It even seems to be happening if I set the image size to what it actually is... The code I am using is below:

<div class="company-panels content-container-row">
   <?php foreach ($contentItems as $item): 
      if ($item['imageFID'] != 0){
         $imageFile = File::getByID($item['imageFID']);
         $thumb = $ih->getThumbnail($imageFile, 121, 9999, false);
      }
   ?>
      <div class="company-panel">
         <a href="<?= $item['link'] ?>" class="company-logo-link">
            <img height="<?= $thumb->height ?>" width="<?= $thumb->width ?>" src="<?= $thumb->src ?>" class="company-logo">
         </a>
          <div class="company-description">
             <?= $item['content'] ?>
             <a href="<?= $item['link'] ?>" class="company-link">Visit <?= $item['heading'] ?></a>
          </div>

foiseworth
View Replies:
ScottC replied on at Permalink Reply
ScottC
in your config.php add this

define('AL_THUMBNAIL_JPEG_COMPRESSION', 99); //or whatever works, the default is 80


And see if that helps. Keep in mind you will need to manually go in and delete your old thumbnails from the file directory under files/cache via ftp or similar :)

we had problems with this on this site:http://www.racheltrevormorgan.com/collections/hats... Since the thumbnails were so small we had to figure out where it was set and up the quality to make them look good.
foiseworth replied on at Permalink Reply
foiseworth
Hi ScottC,

Apologies for the delay in getting back to you.

I have tried your fix and unfortunately it did not work :(, I even remembered to clear the cache!

Actually, just looked and the image is being converted from a png to a jpg. I'll replace with a jpg and see if that fixes it.

Thanks for the tip though - I'll email Andy and ask him to add that to the docs.
borlo replied on at Permalink Reply
Hey ScottC

I got the same Problem with the blurry pictures in the blog.
Can you tell me where is this config.php file located?

I'm kinda new to this CMS :-)

Thanks
mhawke replied on at Permalink Reply
mhawke
This thread is 2 years old so I'm not sure if ScottC is still listening so I'll help out. Have a look on your server in root/config/site.php .
borlo replied on at Permalink Reply
Yea its a very long time since then. I hoped for reply :-)

But thanks mhawke for the info. i found it but it didn't help out for me as well. i added the line into the site.php

Is there maybe another solution for the blurry images in the Blog?
mhawke replied on at Permalink Reply
mhawke
Did you check whether new thumbnails are better with the new setting or are you just expecting the existing ones to look better on their own.
borlo replied on at Permalink Reply
I expected the same looks better on their own. It only appears on the mobile version. May i should add new Thumbnails in another resolution?

You can check them at
http://www.borlo.ch/artflow/
mhawke replied on at Permalink Reply
mhawke
Depending on the code in the block that creates the thumbnails, they are often only created the first time the page is viewed so in order to generate new thumbnails using your new quality setting, you will need to change the dimensions of the requested thumbnail. Just specify a slightly different size and concrete5 will re-create new thumbnails for those dimensions. Your code shows a width of 121px so change that to 125 and see if the thumbnail is better.

I personally don't see a problem with the thumbnails on the blog page ('News') on the URL you provided but beauty is in the eye of the beholder.
mhawke replied on at Permalink Reply
mhawke
I had a look at the code in the image.php file and there is a function called "setJpegCompression($level)" where you can specify a new quality setting in your code so if you add this to your code, it should override the default setting of 80.

setJpegCompression(90);


But you still probably need to re-create the thumbnails in order for the function to take effect on new thumbnails.
borlo replied on at Permalink Reply
heya thanks for looking,

i tried to change it the compression but seems that nothing changed. also the thumbnail set that you mentioned to change from "121" width to "125" i didn't find where to change that..

sorry for my nooby knowledge. i'm very new to that editing in the codes.
also when i see the logo on the mobile it gets a little blurred, isn't PNG made to get a good quality for?

or is there something i do wrong?!

i do set new thumbnails like in the preview of the theme. 241x170 like they got.
mhawke replied on at Permalink Reply
mhawke
Sorry, I'm confusing you because I was confused. The '121px' was referring to the code at the top of this thread which is not your code.

If your blog page lets you set the size of the thumbnails then try choosing a different width and height so that concrete5 will re-generate new thumbnails using the quality setting you added to the site.php file.

Regarding the logo .png file. I don't have a true mobile device handy to check the quality of your logo. All I have is a tablet but it's being served the same PNG file as the desktop version. I can only offer some advice from experience. Sometimes the transparency around the edges of letters gets messy if the original background of the logo image had a white background and you make the white background transparent and then place the PNG image on a black background. Another problem that can result in blurry images is if an image is being forced to render larger than it's real dimensions.