We are transitioning over to a new forum platform. Please post new issues there. Existing threads will be dealt with here unless you choose to move them over. Visit the new forum

Forum

Thread tagged as: Question

Asset Thumbnails inconsistent

Why is it that asset thumbs are sometimes the whole image, and sometimes enlarged to unrecognisable sizes?

It makes for some un-recognisable, un-helpful thumbnails.

assets tray screen shot

I think it would be better to 'scale and pad' the thumbnails, rather than 'scale and trim'.

Simon Clay

Simon Clay 127 points

  • 4 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

Presumably some of these are small? What's the pixel threshold on scaling, do you think?

Simon Clay

Simon Clay 127 points

The logo on the far right is 580px x 60px so, not too bad.

I'm not sure what you're asking on the pixel threshold.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Our thumbs are, it think about 132px tall, so I guess calling a 60px image to 132px is the cause of that.

Simon Clay

Simon Clay 127 points

Yes, that's what's happening.

So I think even a logo that was 2000px x 150px would be 'zoomed-in' in this way, which I don't think is very easy for the eye to recognise.

I feel that it would be better to display them at 100% width or 100% height, whichever hits the edge first.

Using this CSS in a custom UI CSS file I've fixed it. I think it looks much better and it works with photos nicely too:

.thumb {
    width: 100%;
    min-height: inherit!important;
}

Assets fixed

Drew McLellan

Drew McLellan 2638 points
Perch Support

That looks good, thanks.

That does look good. Where did you fix this Simon? Drew are you likely to implement this in a future release?

Simon Clay

Simon Clay 127 points

Hi Terry,

I fixed it by creating a file: my_css_file.css here: /perch/addons/plugins/ui/my_css_file.css containing:

.thumb {
    width: 100%;
    min-height: inherit!important;
}

And adding this line to /perch/plugins/ui/_config.inc

<link rel="stylesheet" href="/perch/addons/plugins/ui/my_css_file.css" />

Simon Clay said:

Hi Terry,

I fixed it by creating a file: my_css_file.css here: /perch/addons/plugins/ui/my_css_file.css containing:

.thumb {
  width: 100%;
  min-height: inherit!important;
}

And adding this line to /perch/plugins/ui/_config.inc

<link rel="stylesheet" href="/perch/addons/plugins/ui/my_css_file.css" />

Brilliant Simon. I think I'm going to have to implement this on my sites

This is great. Thank you Simon.

Simon, please read my new post... http://forum.grabaperch.com/forum/10-02-2015-have-you-created-any-apps

Thanks. Robert

Simon Clay

Simon Clay 127 points

Thanks Robert, I haven't created any Apps as yet, but there are a few that I'd like to develop, so will comment under your post when I get to that stage.

Simon Clay said:

Thanks Robert, I haven't created any Apps as yet, but there are a few that I'd like to develop, so will comment under your post when I get to that stage.

Simon, I'm always willing to code develop with you. Drop me an email and let's see if a plan comes together

Simon Clay

Simon Clay 127 points

Thank you, will do!