Thread Thumbnail by AddonsLab

Thread Thumbnail by AddonsLab [Paid] 3.0.0 Beta 1

No permission to buy ($29.99)
@El Porcharo thank you for sharing your solution. I hope it helps some other users. Please let us know what exacrtly you would like to have as an option in the next version?
I plan to have a forum with YT videos and currently use round avatars, so, I might have a similar use case as @El Porcharo. I would like them to be square for this add-on if we are using round avatars. And his suggestion of 16:9 (or rectangle/4:3) would work well for videos, though, I'd settle for square if I can do that easily. Also I echo his suggestion to show larger, but for me, only in forum view is needed. When mixed with the other content it should be the same as that content.

Edit: If I can just switch to square, I am happy. So your eyes say "this is a video" and not an avatar. Increasing the size a hair in forum view is a bonus.
 
Last edited:

For everyone willing to resize thumbnails, while keeping the picture aspect ratio and showing a center-cropped picture (no matter if portrait or landscape)


I've finally found the relevant CSS code.

Well... almost! 😅

The following code sets all thread thumbnails (where there's an attachment for it) to be shown on a round bordered rectangular of 80px by 60px, while leaving all other thread's pics with the same default avatar size. I've set my avatars to be round, so I see a mix of bigger rectangular pictures and small rounded avatar, and for the moment I'm fine like this.

I've also left blank the default thumbnail field in AL Thread Thumbnails options, because I want to show members avatar if there is no thumbnail to be shown.
But if you set a default thumbnail image, it won't get the set thumbnail's size as it will stay the same size of user avatars.

Here we are, put this in your extra.less:

Code:
.threadThumbnailWrapper    div.avatar
{
    width: 80px; // CHANGE this value for a different width (also change max-height below to the same value)
    height: 60px;  // CHANGE this value for a different height (also change max-height below to the same value)
    border-radius: 5px!IMPORTANT;  // this is making rounded thumbnail corners: INCREASE or REDUCE if you want them more round or less round, comment or delete if you want square corners
}

.threadThumbnailWrapper    div.avatar img.alignThumbnail
{
    object-fit: cover;
    min-width: 100%;  // this will scale width to full thumbnail witdth for centered cropping - DO NOT TOUCH
    min-height: 100%;   // this will scale width to full thumbnail height for centered cropping - DO NOT TOUCH
    max-width: 80px;  // CHANGE this value for a different width
    max-height: 60px;  // CHANGE this value for a different height
}

// the following CSS will scale and center crop the smaller thumbnails that are showing on widget in default avatar size
.threadThumbnailWrapper  a.avatar img.alignThumbnail
{
    object-fit: cover;
    min-width: 100%;
    min-height: 100%;
}

All other code combinations that I tested, didn't came up as expected. I turned to get stretched and deformed user avatars on "What's new" and all places other than "forum_view" and a few other issues that I don't even remember.

I can't go further than this as I'm not a coder, so if anyone else finds a fix for the missing code, please share.



@AddonsLab please 🥺 implement this as an option in next release, and please also add those options to choose if you want to show same size default thumbnail or not and possibly some more places where to show this or not (like exclude widgets) and so on.
Also, is it possible to turn the forum IDs fields into a forum names selectable list, so it would be easier to set up?

Thanks for your time
Hello,

This is almost exactly what I want but there is a little problem. Usernames are displayed inside the thumbnail.1619261274833.png
 
when the number of forums is too large, it is not easy to see which ones are selected in a large list, and it is possible to de-select some of them accidentally, so ID-based list in even easier to use in these cases.
well... this makes it "not easy" every time, as you'll always have to search for nodes IDs before adding it to the list...


Custom CSS rules applying custom sizes/corners are less likely to be useful for other users. Also, once you have these rules in your extra.less, they will not be lost with the upgrade and thumbnails will be shown.
I don't really agree with this, as I've read through the whole thread and found many users asking for an option to make thumbnails bigger and possibly square... that's why I shared my CSS code.


Please let us know what exacrtly you would like to have as an option in the next version?
  • The possibility to set thumbnail size and shape (circle/rectangle/square);
  • An option to choose if you want to show a default thumbnail or leave the user avatar untouched when no image is attached to a thread;
  • Choice for showing the thumbnails inside widgets or not.

Have a look at this free thumbnail add-on: it provides all these features while it's a free add-on!

Last but not least, I'm testing TH Filters on my staging board, but I see Thread Thumbnails doesn't seem to support it: the add-on adds 3 new pages for showing filtered threads list, just like the default XenForo "What's new" and "Latest" pages, but I don't see the thumbnails showing up on that.

Any chance to make Thread Thumbnails to also support TH Filters pages, please? 🥺

 
LOL

I know that, buddy

I've only mentioned it to better explain the features I was talking about, as he didn't understand on my previous reply 😅
 
Does anyone know if you can order the branding removal after your initial order?
 
Last edited:
Your website is really confusing! So I downloaded the trial but it won't install. It says it needs: [AL] Core Package 1.3.3+.

In my license area this is not listed, and it's not listed in your add-ons. I searched "core" on your forum, zero results.

EDIT: Found the link here on XF. You should make it easier.
 
Last edited:
Your website is really confusing! So I downloaded the trial but it won't install. It says it needs: [AL] Core Package 1.3.3+.

In my license area this is not listed, and it's not listed in your add-ons. I searched "core" on your forum, zero results.

EDIT: Found the link here on XF. You should make it easier.

Is the addon works good ? As I’m looking for my forum as well.
 
@El Porcharo thank for the code! I put it in extra.less but still have round images what am I doing wrong?
UGH okay
"The following code sets all thread thumbnails (where there's an attachment for it)"
I guess your code won't work on the YouTube thumbnails. :(

Anyone know how to get square or rectangular for the video embed thumbs?
 
I tried some code a few pages back and it changes the avatars for all forums. I only have this add-on enabled in one forum.

Let me just post what I am trying to achieve and maybe that is easier. I have a Suggestions forum and round avatars and I want square thread thumbs, so radius 5 works for the rounded edge.

I also want to make them a little larger.

I tried some things and in Suggestions forums the thread title butts up against the thumb if you make it larger. I used padding but that is not the best.

And for some reason when I (as admin) make a post with no image in it and with no replies, the avatar gets doubled and you can see the double as it is slightly off.

So can someone please help and check this in a Suggestion-type forum for square and larger? Also make an admin post with no image to check that. That would be awesome!!!!!
 
Last edited:
If you can share a public link (even in private if you want) I'll have a look and see if I can help
Thanks for the offer to help, I paste your code into extra.less and nothing happens so I am wondering what I am doing wrong. I even added !important to every line.
 
Back
Top Bottom