thumbnails very blurry

andre's Avatar

andre

05 Oct, 2018 09:04 AM

I use images for navigation. Thumbnail size is set to 90x90px. Thumb image is also set to 90x90px.
I find the thumbnail image to be very blurry. See attached screenshot.
Is there a way to improve the image quality for the thumbs?
Thank you

  1. Support Staff 1 Posted by Dmitry Semenov on 05 Oct, 2018 02:23 PM

    Dmitry Semenov's Avatar

    Hello,

    Please link to the page with the issue and I'll check what's wrong. What's the size of the generated image file (right click -> open image in new tab)?

  2. 2 Posted by andre on 05 Oct, 2018 02:32 PM

    andre's Avatar

    Hi Dmitry,

    example on a staging server: https://www.headstart.design/hvb2/product/tie-2/
    Generated inage is 90x90px.
    I am on a 4K monitor (retina) which may show it more.

    As a solution I tried to show a larger generated image in a smaller (90x90) thumb by setting the thumbnail to 90 x 90 and the image itself to 150x150 but that does not work, the thumbnail scales with the bigger image.

    Thank you

    13m2 Effectieve websites <http://13m2.nl/>

  3. Support Staff 3 Posted by Dmitry Semenov on 05 Oct, 2018 02:50 PM

    Dmitry Semenov's Avatar

    You may add style to your theme style.css (or custom CSS option):

    .rsTmb img {
      width: 100%;
      height: auto;
    }
    

    and size of thumbnail image will always match the size of the its area.

  4. 4 Posted by andre on 05 Oct, 2018 03:25 PM

    andre's Avatar

    Yes, that should work but it does not, strangely enough.
    No idea why but I now set the max-width to 90px and that does the trick.
    Images look much sharper now.

    Thanks!

  5. 5 Posted by andre on 05 Oct, 2018 03:26 PM

    andre's Avatar

    see screenshot: image is 150px scaled down to 90px in the browser:

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Already uploaded files

  • Schermafbeelding_2018-10-05_om_10.56.15.png 115 KB

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac