thumbnail

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Tagged: Image, resize, thumbnail

Author

Posts
December 2, 2016 at 10:54 am #317289

edge
Buyer

Post count: 191

Hi, I have the problem that a business owner uploaded an image that is not displayed well in the thumbnail. The head is cut off 🙂

http://screencast.com/t/cPujr6j3vD
http://screencast.com/t/wur1NVBeHk

As the thumbnail is auto-generated. How could I fix this pls?

Thanks

December 2, 2016 at 12:31 pm #317352
Kor
Moderator

Post count: 16516
Hi Gerald,

I’ve just checked that page http://scheidungsinfo.at/?geodir_search=1&stype=gd_place&s=mirko&snear=&sgeo_lat=&sgeo_lon= and I’m able to see the issue there. The only way to fix this would be to change the background-size to contain using the custom CSS code below. But this will effect all listings. Let us know if you’re okay with that.
```
.geodir_category_list_view li .geodir-post-img .geodir_thumbnail {
    background-size: contain;
}
```
Thanks!
December 20, 2016 at 11:44 pm #328018

palicali
Expired Member

Post count: 40

Hi –
I am having the same issue that my thumbnails look like a mess on the list page since images are uploaded in various sizes and display as cutoff in the thumbnails.

– Is there a recommended ratio for height/width for thumbnails to look nice as in the demo?
– Can the actual photos be larger versions of that size ratio and the thumbnail will show the whole photo but smaller? Or will the thumbnail just crop a small portion of the larger photo?

If I decide to use your CSS code above, which file should I put that in and where exactly in the code? I don’t understand the consequences though of using the code – does it impact only thumbnails or all images? I am just starting my directory, so if it’s a good thing to do from the beginning now would be a good time for me to do it.

Thanks!

December 22, 2016 at 12:42 am #328610

Kor
Moderator

Post count: 16516

Hi Palicali,

Could you please share the URL of thr site in question so that I could take a better look at it?

Thanks

December 22, 2016 at 3:14 am #328694

palicali
Expired Member

Post count: 40

This reply has been marked as private.

December 22, 2016 at 1:03 pm #328884
Kor
Moderator

Post count: 16516
Hi there,

Using the custom CSS code below should resize the image to fit the image container. Inset into GD > Design > Scripts > Custom Style CSS . Let us know how it goes.
```
.geodir_category_list_view li .geodir-post-img .geodir_thumbnail {
    background-size: contain!important;
}
```
Thanks!
Author

Posts