Limit 'link' image sizes

billybatz9

Active member
Right now, there is an option to resize images when they are 'uploaded'. But I guess it doesn't apply to those images they are being submitted through a link like photobucket. Is there a way I can implement the image resizing for both? If not, this should be added.

Thanks
 
Linked images if they are too large are resized and can be viewed in a full size by clicking on it.

Technically, the only way to 'resize' these images the same way XenForo resizes attachments is to download them from the remote host and store them on your local server.
 
Limit which size?

Resize in what way?

Hotlinked images don't exist on the server.
So what you guys are saying is that when a person adds a photo using the image button and having to insert a website url like photobucket or flickr or anything, it doesnt get hosted on my server? Therefore my memory wont increase?
 
and for example....
any images being "uploaded from their computer" turns out to be within the dimensions 400x400 because that's what I have it set to.
However, if a person clicks on the image button to post an image using a photobucket link or something, the image(s) take up the whole screen. They do not stay within the 400x400 dimensions.
I was just wondering if there was a way to re-size THOSE photos. The ones that people upload using a "link"

Thanks guys
 
So what you guys are saying is that when a person adds a photo using the image button and having to insert a website url like photobucket or flickr or anything, it doesnt get hosted on my server? Therefore my memory wont increase?
Correct.
The images are hosted elsewhere so don't use any disk space on your server.

If you want to limit the size of embedded images, add this to EXTRA.css:
Code:
.message .messageContent .messageText img {
max-width: 400px;
}

If you don't want images to click zoom, add this instead:
Code:
.message .messageContent .messageText img {
max-width: 400px !important;
}

I shall move this thread from suggestions as it's not a valid suggestion.
 
Hello,

i've tryed to edit the extra.css with the code posted above but it doesn't work as a responsive, i.e. on my mac retina it's ok, on my desktop pc it's ok but when i switch to a Galaxy S5 smartphone or a standard resolution tablet the image is cropped. There is a way to get a workaround about this issue?
Thanks in advance.
 
If you want to limit the size of embedded images, add this to EXTRA.css:
Code:
.message .messageContent .messageText img {
max-width: 400px;
}
@Brogan, is it possible to add to this code also variable max-height: 400px?
So if picture is 800px widht and 1600 hight, it will be in post 200px widht and 400px height?
 
Correct.
The images are hosted elsewhere so don't use any disk space on your server.

If you want to limit the size of embedded images, add this to EXTRA.css:
Code:
.message .messageContent .messageText img {
max-width: 400px;
}

If you don't want images to click zoom, add this instead:
Code:
.message .messageContent .messageText img {
max-width: 400px !important;
}

I shall move this thread from suggestions as it's not a valid suggestion.

Hi all, sorry for digging up an old thread but I was following the guide above and it worked perfectly for me when shinking the size of images posted onto my site from elsewhere.

However when someone tried to make a poster they got a server error message, so I had to delete the code again to fix the problem.

Im using 1.56, is there any option to fix this or something else I need to do?

Thanks
 
Correct.
The images are hosted elsewhere so don't use any disk space on your server.

If you want to limit the size of embedded images, add this to EXTRA.css:
Code:
.message .messageContent .messageText img {
max-width: 400px;
}

If you don't want images to click zoom, add this instead:
Code:
.message .messageContent .messageText img {
max-width: 400px !important;
}

I shall move this thread from suggestions as it's not a valid suggestion.

Can I use the same code to limit attached images in a custom page?
 
For reference, in XenForo2, its a bit different:

Code:
.p-body-pageContent img {
max-width: 200px;
max-height: 200px;
}

@Brogan in xf2, the above code works but unlike xf1, when you click on the smaller image, it doesn't show the larger version.
Any idea how to fix this?
 
Top Bottom