toughdeveloper / imageresizer
October CMS Plugin to resize and compress images.
Installs: 1 944
Dependents: 0
Suggesters: 0
Security: 0
Stars: 46
Watchers: 7
Forks: 39
Open Issues: 16
Type:october-plugin
Requires
- composer/installers: ~1.0
- tinify/tinify: ^1.3
This package is not auto-updated.
Last update: 2024-12-17 04:51:57 UTC
README
- Introduction
- Available filters
- Using a string
- Using a variable
- resize()
- imageWidth() - imageHeight()
- Image Compression
Introduction
Resizes an image to the required dimensions. It accepts a string with a file path to the image or a October\Rain\Database\Attach\File
object (you will have one of these if you have used the attachOne or AttachMany relationship)
Please note, the not found image can be overwritten via the settings in the admin area.
Available filters
resize(int $width [, int $height , array $options])
, imageWidth()
, imageHeight()
Using a string
Please note, if the filter alters the URL, you must apply resize afterwards
{{ 'assets/graphics/background.jpg' | theme | resize(500,500) }}
Using a variable
{{ property.image | resize(500) }}
resize(int $width [, int $height , array $options])
Resize an image according to the given params. If $width
or $height
is 0
, that value is calculated using original image ratio
Options
Usage in template
{{ property.image | resize(500, false, { mode: 'crop', quality: '80', extension: 'png' }) }}
Usage in PHP
The image resizer can also be used easily in PHP, as follows:
use ToughDeveloper\ImageResizer\Classes\Image;
$image = new Image('/path/to/image.jpg');
$image->resize(150, 200, [ 'mode' => 'crop' ]);
Usage in Backend List
The image resizer can also be used on backend lists with the type of thumb
, e.g.
image:
label: Image
type: thumb
This works with:
You can also optionally pass width (default 50), height (default 50) and options as follows:
image:
label: Image
type: thumb
width: 75
height: 100
options:
mode: crop
imageWidth() - imageHeight()
Return current image width/height - useful if you need to know the size of an image resized only by one side.
{{ '/path/to/image.jpg' | resize(250) | imageHeight() }}
Image Compression via TinyPNG
The plugin integrates with the TinyPNG API to provide image compression. A developer API key is required, to obtain one visit https://tinypng.com/developers. Once obtained, enter it in the Image Resizer Settings area of October CMS backend.
TinyPNG offer 500 free compression per month, the plugin automatically caches resized images to save credits, an option to not compress certain images is also available.
If you are focussed on pagespeed, it is recommended to set your image quality at 70-80 to obtain the lowest filesize whilst still retaining high quality images.