Image Support handles every image on your site. When a member uploads an image, it's stored once. Image Support then makes and caches each size a page asks for, applies cropping and filters, and adds a watermark if you want one.
ACP > Modules > Core > Image Support
| Setting | What it does |
|---|---|
| Convert to JPG | Converts uploaded PNG and GIF images to JPG, which are usually much smaller (default: on) |
| Resize Animated GIFs | Resizes animated GIFs too. This is slow and loads the server, so leave it off unless you need it. |
| Block Original Size | Only serves images in the fixed sizes, never the original upload |
| Enable Lazy Loading | Adds loading="lazy", so images load as the visitor scrolls to them |
| Minimum Image Width | Refuses uploads narrower than this (0 = no minimum) |
| Maximum Image Width | Shrinks larger uploads to this width before saving them (0 = no maximum). Saves disk space. |
| Delete Cached Images | Deletes cached sizes that haven't been viewed for this long (default: 1 day) |
| Setting | What it does |
|---|---|
| Max Image File Size | The largest image a profile in this quota can upload |
| Allowed Image Types | The image file types allowed (default: png, gif, jpg, jpeg) |
| Watermark Images | Adds a watermark to images. Upload the watermark image in Image Support's Images tab. |
| Watermark Cutoff, X Offset, Y Offset | No watermark on images narrower than the cutoff, and the watermark's position |
| Only Images For Sale | Watermarks only images that have a price |
Every image has an address like this:
https://example.com/(module url)/image/(field)/(item id)/(size)
For example, https://example.com/profile/image/profile_image/1/icon is the profile image of profile 1, 128 pixels wide.
Sizes (width in pixels, by name or number):
| Name | Width |
|---|---|
| xxsmall | 24 |
| xsmall | 40 |
| 56 | |
| small | 72 |
| icon96 | 96 |
| icon | 128 |
| medium | 196 |
| large | 256 |
| larger | 320 |
| xlarge | 384 |
| xxlarge | 512 |
| xxxlarge | 800 |
| 1280 | |
| 1600 |
Sizes without a name are used by their number, for example .../1280.
Crop: add crop= to the address, for example .../icon/crop=square:
auto and squareportrait, height, width and fillnone (keep the original shape)16:9 or 4:3Filters: add filter=, for example .../large/filter=grayscale. Chain several with commas: filter=sepia,emboss. Filters that take a value use a colon: filter=brightness:-50. The filters are:
blur, border, brightness, colorize, contrast, cut, edgedetect, emboss, grayscale, negative, pixelate, reflection, rotate, rounded, sepia, sketch, smooth
Templates normally build these addresses with the {jrImage_display ...} template function. See the Template and Function Reference.