Thumbnail Recalculation

[MattW]

MattW submitted a new resource:

Thumbnail Recalculation - Attachment Thumbnails recalculated

One thing which has bugged me from day 1 with XF is the way image attachments are appended to the post if they aren't inserted into the message body.

This is fine if you stick with the 100 pixel default thumbnail size, but if you change this (I've always had 600 pixel thumbnails on my sites), it looks a complete mess

View attachment 54525

View attachment 54524

Here is how I've got around it in XF 1.2 with a few lines in EXTRA.css and a single template edit to...

Read more about this resource...

 

[MattW]

MattW updated Thumbnail Recalculation with a new update entry:

Attachment Block Width

Just noticed that the width of the each attachment block is also hard coded to 33%

.attachment
        {
            float: left;
            width: 33%;
        }

You could change that to 25% or 20% depending on how many attachments you want to have per line

Read the rest of this update entry...

 

[Steverd]

Very nice and I know what you mean. It would be great if XF did what Wordpress does in that you can insert your thumbnail in a small, med or large size.

 

[tonmo]

MattW updated Thumbnail Recalculation with a new update entry:

Attachment Block Width



Read the rest of this update entry...

I've looked around a lot... where do I find .attachments in order to make this change? Or is this just something you add to EXTRA.css? (because the latter didn't take...)

 

[MattW]

I've looked around a lot... where do I find .attachments in order to make this change? Or is this just something you add to EXTRA.css? (because the latter didn't take...)

I think this has been changed in a recent update to XF. The code was originally in attached_files.css

This is what is there now

.attachment
        {
            float: left;
            width: 50%;
            max-width: 300px;
        }

I haven't checked everything though, because I'm on my iPad. I'll have a look at the code on my site later today.

 

[MattW]

Just checked, and it's using that code above now.

 

[tonmo]

excellent - thanks!

 

[tonmo]

Hmm. Suggestions for making this work, though? If I change the width to 25% it successfully gets four photos on one line, but the support text to the right (which denote # of views, filename, etc.) gets squeezed and only ~2 characters display, rendering it illegible. How hard would it be to move the text so that it's below the thumbnail image, instead of to the right of it?

 

[tonmo]

nevermind... this ended up being a good treatment for me:

        .attachment
        {
            float: left;
            width: 50%;
            max-width: 280px;
        }

 

[Jordyn]

thank you so much for this. now i can extend my media players width.

i have set to 100%, will this effect say iphone etc please?