How to easily resize images

[conchobhar]

In the last few months, I've been seeing more posts that have huge, screen-spanning images. One or two isn't that bad, but they add up, and can quickly make a page obnoxiously long to scroll through. So I thought it was worth pointing out that XenForo actually has a built-in feature to resize images.

After inserting an image, click on it to bring up the bounding box and the image menu. Then, click on the ✣ icon to enter a width or height (you don't need both; it will automatically scale to keep the image proportions, so one is sufficient). Or, you can click on one of the blue squares in the corner and drag them to manually resize the image. Alternatively, for those who prefer to just type the BBcode manually, add width="000px" or height="000px" into the [IMG] tag for the effect. No matter the method you choose, there's not much to it!

If you're concerned this will make your image indistinct at a smaller size, don't worry: images in a post can be viewed in full by clicking on them. Also, all the images in a single post become part of a gallery, allowing them to be easily flicked between in the preview mode. You can see what I mean by checking these images:

Also, the gallery mode is only enabled for a post if the images have been resized (and only includes images that have been resized). So that's another benefit!

 

[Patrick]

That's a really great feature. Thanks for highlighting it!

 

[Violentvixen]

Oh yeah, I was thrilled when I discovered this early on after we moved over. Made uploading/organizing Festivus photos so much easier than on the old forum!

 

[Johnny Unusual]

Yeah, I constantly resize. Not euphemism for anything.

 

[gogglebob]

I just want to note that I was literally coming to the rarely visited (by me) Talking about TT forum here to ask how to do this, and imagine my amazement when I saw this thread. Hooray and thank you!

 

[FelixSH]

Thanks for pointing that out. I didn't know this was a thing.

 

[Peklo]

I have always been under the impression that the screen-filling giant images seen on any forum that uses XenForo are less about poster preference for such girth, and more the cause of not knowing of the alternatives. On TT 2.0 the dearly departed [thumb] tag saw extremely heavy use by me because it finally allowed me to insert visuality into posts in a way that didn't feel overtly invasive to others's browsing (and I probably still went overboard with it). When we made the jump here I instantly keyed into this method of retaining that etiquette, so I'm glad the PSA is being put out there.

 

[Yimothy]

I’m not sure if this is caused by the resizing in the image tag, the way the forum scales things, or if it’s an iPhone problem, but I was reading Peklo’s recent post in the Etrian thread and all the images looked kind of vertically stretched. Looking closer, the map squares were all rectangles. When I turn my phone sideways they become squares. I think maybe the phone is resizing to the width of the page and the img tag is resizing for a set height, in this case 250 pixels (though it was displaying at much more than that on the phone) and the interaction of the two was screwing up the aspect ratio.

This is in no way a big deal, but I wonder if there’s some way to fix or disable this feature in mobile mode. Images seem to get resized to fit the screen anyway, and a few times I’ve used the phone’s inbuilt zoom to try and look more closely at an image and accidentally tapped the image, switching to the gallery view but with the phone zoom still active leaving me unable to adjust the zoom or exit the gallery view without reloading the page.

 

[Peklo]

Not sure if it helps you troubleshoot, but I resized the images in that particular post to a height of 260 pixels each--typically I default to 270 if there's enough width in a row, since that's roughly the image size output by the thumb tag on TT 2.0 which I got accustomed to.

 

[Yimothy]

It’s still much the same - if I tap the image for the gallery view it contracts vertically to the correct size. I think what’s happening is that either my phone or the forum software is shrinking the image to fit horizontally resulting in a height of less than what it considers to be 260 (even though it’s more than 260 on screen pixels), and then the img tag being set to 260 is causing it to stretch it vertically to get there. It’s a minor annoyance, particularly now that I’m aware of it, and I wouldn’t want to mess up your formatting on other screen types to fix it, I just do 99% of my TTing on my phone in portrait orientation so I don’t tend to think of how things work on desktop.

 

[Octopus Prime]

Oh this is Very Helpful Informatuon