XF 2.2 Resize linked images in threads

nopitter

Member
Hi,

what i want to do is: automatic resize (the view of) linked images in threads.

I want to fix the maximum width. Bigger images should be resized, smaller images should not be touched.
General behavior should not be changed, so responsive layout should work as by default.

Skin is the standard skin.

After reading a lot and trying even more, i ended up with the following code in extra.less:

Code:
.message-body
{
  width: 100% !important;
  max-width: 1024px !important;
  height: auto;
}

That works - even I do not understand exactly what I am doing, its stolen from a css info website ;) - but I have some questions.

1. Is message-body the correct class? Or should I use the bbImage class? What's the difference in this scenario?

2. I also tried other code mentioned here in the forums e.g. like

Code:
      .message-body img
      {
      max-height: 800px !important;
      max-width: 100% !important;
      }

I have noticed, that this works in my browsers with a window opened in "normal" size on my PC. Scaled the browser window smaller to smartphone-like aspect ratio, you will get an slider; scaling does not work as I want it.

Why? ;)

3. Is there a better solution, than the code I am using. As you can see, i do not know about css and I do not want to break anything.

Thanks for your help!

Peter
 
Same issue here.I'm wonder if it could someway automatically resize the images uploading to the forum from a link like Imgur.I'd like it to uploading with a maximum resolution 1920X1080 at forum..Is that possible?
 
  • Like
Reactions: CVN
Same issue here.I'm wonder if it could someway automatically resize the images uploading to the forum from a link like Imgur.I'd like it to uploading with a maximum resolution 1920X1080 at forum..Is that possible?

What do you mean, "uploading" and "resize"?

If you want to limit the size of linked images; that's what the code in extra.less is for. The original image size remains untouched. It is only for the view within a thread.

If you want to resize images in term of resolution, filesize - you have to process the original file. That can be done with attachements, xenforo gallery. Or via plugin, which stores a copy of all linked images on your own server (what I do not want to do because of copyright issues here in Germany/EU).

Peter
 
Last edited:
@AndyB's addons:


 

I know. But in this case, all hotlinked images are strored on my own server and then processed.
Living i the EU and with a server inside EU, that is not an option because of the law.

So, there is no way to avoid > 12 MB smartphone ;) images hotlinked in threads (except not allowing embedding such images). Why dont people understand the technics, they are using ;) Ok, another thread.

What i can do (and what I have tried via the code in extra.less) ist to resize the view of the images inside a thread. So that it fits in the layout and keeping threads readable.

I am just asking, if there is better code.

Thanks!
Peter
 
I know. But in this case, all hotlinked images are strored on my own server and then processed.
Living i the EU and with a server inside EU, that is not an option because of the law.
All well and good.
How often have I searched for and found instructions on any topic in any forum?
Unfortunately, the pictures were inserted via Hotkinks at some point. The hoster no longer exists or the user has deleted the pictures.
This means that the entire contribution is usually thrown away.
We have been banning hot links for a few years.
Since then, we no longer have this problem.
The pictures end up on our server and are compressed.

In all these years, we have not noticed that fewer pictures are posted.
 
Unfortunately, the pictures were inserted via Hotkinks at some point. The hoster no longer exists or the user has deleted the pictures.
This means that the entire contribution is usually thrown away.
This is often true. However the alternative of downloading and then attaching is very often a blatant copyright infringement. I presume that is what nopitter is getting at. It has also been debated about whether or not hotlinking is actually legal.
 
Last edited:
However tyhe alternative of downloding and then attching is very ofetn a blatant copyright infringement. I presume that is waht nopitter is getting at.
Exactly. I am running my forum +20 years, so having old threads more or less useless, because image links are dead, is a well known scenario.

But law is, at it is. And to be honest, no thread is importantant enough, to take a risk (ok, as long it is a "fun" forum and not wikileaks etc.)

BTW, I allow attachements for (paying) Premium Members. And even Pemiums are able to atttach such media, which they would not be allowed to use such way by the law ... that does not happen in reality. Even if the fee is not high, paying cash means to take responsibily for the forum, for the forum owner, for own actions.

Peter
 
I just tested this code in extra.less and it works perfectly for me in both PC browsers and on a phone:

Code:
/* limit the size of images in threads */

.message-body img
{
max-width: 50% !important;
}

And here's the code for doing the same thing in private messages:

Code:
/* limit the size of images in posts and conversations */

.message .messageContent .messageText img {
max-width: 50%;
}
 
Top Bottom