29
  • 38 ratings
  • 26 reviews
  • 57,000 installations
Free
Add to project

Product support

Visit this product's website for support.

Categories

Provides Twig filter to easily resize an image to the required dimensions. Example:

{{ '/path/to/image.jpg' | resize(250, 100) }}

Features

  • Provides Twig filter to easily resize images
  • Reduces image file size, optimizing page speed
  • Doesn't require any additional large image manipulation libraries
  • Caches resized images for improved speed
  • Usage in PHP available
  • Usage in Backend list available
  • Works with the fileupload and mediafinder plugin field types, can be used on general site images pretty much anywhere and works with other plugins, e.g. Static page plugin, October Blog, etc with no extra changes required.
  • Displays a customizable image not found if the image doesn't exist
  • Provides greater control over how an image is rendered.
  • Optional integratration with Tiny PNG to further compress images
The following plugins extend or depend on the plugin
Staff
Free

Staff

Manage a list of staff or a team and display it on your website.

673 installations
# 336 in Free of all time.
Free

Staff

Manage a list of staff or a team and display it on your website.

Content

Better Content Editor
$10

Better Content Editor

Der etwas bessere Content Editor

18 projects
# 127 in Paid of all time.
$10

Better Content Editor

Der etwas bessere Content Editor

Content

Instagram Feed
$7.90

Instagram Feed

Instagram feed on your website

118 projects
# 19 in Paid of all time.
$7.90

Instagram Feed

Instagram feed on your website

Content, Social

The following themes use this plugin
$9.90

Material Portfolio & Resume

41 projects
# 13 in Paid of all time.
$9.90

Material Portfolio & Resume

One Page Theme with content management tools for a very fast start!

Portfolio website, Single page

$10

Material Journal

31 projects
# 16 in Paid of all time.
$10

Material Journal

Material Journal is a simple theme in the style of material design. It can be used as personal blog or journal with several authors. It has a custom template to showcase special timeless elements/information

Blogging, Frameworks

$25

OctoLanding

12 projects
# 24 in Paid of all time.
$25

OctoLanding

Universal landing page and promo constructor it's a internet tool which is made for IT projects working. Updates, additions and support are guaranteed

E-Commerce, Single page

$99.99

Sneakers E-Commerce Theme for Shopaholic

74 projects
# 4 in Paid of all time.
$99.99

Sneakers E-Commerce Theme for Shopaholic

Customizable and mobile-friendly e-commerce theme for Shopaholic designed especially for an online shoe store.

E-Commerce

$19.99

PAGE BUILDER - Modular Theme

12 projects
# 27 in Paid of all time.
$19.99

PAGE BUILDER - Modular Theme

Convenient page builder with 50+ blocks

Corporate

Free

MaterialKit

6 installations
# 153 in Free of all time.
Free

MaterialKit

A beautiful theme based on CreativeTim MaterialKit. Comes with a PageBuilder in StaticPages.

Corporate, Frameworks

$7

Saratov paradise

32 projects
# 11 in Paid of all time.
$7

Saratov paradise

`Saratov paradise` is a multifunctional theme, with a full-fledged tool for creating your own landing from ready-made blocks in a short time.

Portfolio website, Single page

$16

Yell-Ow!

8 projects
# 22 in Paid of all time.
$16

Yell-Ow!

Yell-Ow! - Ultimate Company Profile

Blogging, Portfolio website

$20

Axiam E-Commerce Theme for Shopaholic

9 projects
# 20 in Paid of all time.
$20

Axiam E-Commerce Theme for Shopaholic

Responsive Bootstrap 4 Shopaholic theme for October CMS

E-Commerce

$99.99

Biolia E-Commerce Theme for Shopaholic

9 projects
# 25 in Paid of all time.
$99.99

Biolia E-Commerce Theme for Shopaholic

Customizable and mobile-friendly e-commerce theme for Shopaholic designed especially for an online organic food & eco products store.

E-Commerce

Image Resize Examples

Please use documentation located at https://github.com/toughdeveloper/oc-imageresizer-plugin

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.

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) }}

With more options

See list of options below

{{ property.image | resize(500, false, { mode: 'crop', quality: '80', extension: 'png' }) }}
Key Description Default Options
mode How the image should be fitted to dimensions auto exact, portrait, landscape, auto, crop
offset Offset the resized image [0,0] [int, int]
extension The extension on the image to return auto auto, jpg, jpeg, gif, png
quality The quality of compression *requires cache clear 95 0-100
sharpen Sharpen the image across a scale of 0 - 100 *requires cache clear 0 0-100

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
    sortable: false

This works with:

  • AttachMany (uses first image) Docs
  • AttachOne Docs
  • Mediafinder Docs

You can also optionally pass width (default 50), height (default 50) and options as follows:

image:
    label: Image
    type: thumb
    sortable: false
    width: 75
    height: 100
    options:
        mode: crop

  • Found the plugin useful on 14 Jun, 2022

    I used <img src="{{'test.png'|theme }}"/> / octobercms v2 and got this error: explode(): Argument #1 ($separator) cannot be empty ~/plugins/toughdeveloper/imageresizer/classes/Image.php line 160

  • Found the plugin useful on 23 Oct, 2021

    Wonderfull! It would be great if you add also cdn support inside.

  • Found the plugin useful on 20 Dec, 2019

    This is a great plug-in. But after update 1.4.0, I seen a error:

    development.ERROR: ErrorException: unlink(/home/website.com/public_html/storage/app/uploads/public/9f6/728/31c/9f672831c36fcc2db6804895b5f1b047): No such file or directory in /home/website.com/public_html/plugins/toughdeveloper/imageresizer/classes/Image.php:123 Stack trace:

    /home/website.com/public_html/plugins/toughdeveloper/imageresizer/classes/Image.php(123): unlink('/home/website.com/...')

    /home/website.com/public_html/plugins/toughdeveloper/imageresizer/classes/Image.php(99): ToughDeveloper\ImageResizer\Classes\Image->deleteTempFile()

    Please check it!

  • author

    Replied on 10 May, 2020

    Sorry for the delay. This should be fixed in the latest 1.4.1 update. It now checks the temp file exists before attempting to delete it.

  • Found the plugin useful on 4 Nov, 2019 

    [OFFLINE.ResponsiveImages] DOM manipulation failed: DOMDocument::loadHTML(): htmlParseEntityRef: expecting ';' in Entity, line: 1

    What am I doing wrong?

  • author

    Replied on 10 May, 2020

    Hi, from the error message it seems the error is being thrown from another plugin (https://octobercms.com/plugin/offline-responsiveimages).

  • Found the plugin useful on 7 May, 2019

    Great plugin, saves a lot of work. Just put images in assets folder without thinking and decide later which size and aspect ratio you need. Thank you!

  • Found the plugin useful on 28 Nov, 2018

    Works great!

  • Found the plugin useful on 16 Nov, 2018

    Wow! Very utility plugin! work fine! thanks

  • Found the plugin useful on 23 Oct, 2018

    Hello dear,

    Is there a tutorial on using plugin?

  • author

    Replied on 23 Oct, 2018

    Hi. Please see documentation on github - https://github.com/toughdeveloper/oc-imageresizer-plugin

  • Found the plugin useful on 4 Sep, 2018

    Does anyone know how to clear images cache? I've tried using https://octobercms.com/plugin/romanov-clearcachewidget but it doesn't clean cached images.

  • Found the plugin useful on 25 Jul, 2018

    Thank you for this great plugin.

    A little question. The plugin doesn't work with a string containing the absolute URL of an image from another domain, like

    https://upload.wikimedia.org/wikipedia/commons/3/3d/Jan_Cossiers_-_Prometeo_trayendo_el_fuego%2C_1637.jpg

    Does it? I think the plugin needs the source image stored at the own server, but I want to be sure.

    Thank you.

  • Found the plugin useful on 21 Mar, 2018

    Hi, the plugin is great. Thank you for your work.

    However, there is an issue with image duplication (and possibly triplication), mentioned in https://github.com/toughdeveloper/oc-imageresizer-plugin/issues/18

    Could you please have a look? Thanks again.

  • Found the plugin useful on 18 Mar, 2018

    Hi Greetings my dear, this is very interesting your plugin, that's why I installed it in my october version 434 and the version of the plugin is 1.3.5 installed but when using it in the backend within the model in the file field.yalm

    I get the next error

    The partial '_field_thumb.htm' is missing.

    it seems that when you install it is not downloading the view you need but because it occurs because when you install it does not download the views you do not lose

    could you help me please

  • Found the plugin useful on 23 Feb, 2018

    How do you crop, like from center?

  • Found the plugin useful on 4 Dec, 2017

    In 'ToughDeveloper\ImageResizer\Plugin' 'function evalThumbListColumn()' need to change $record['attachOne'][$column->columnName] on $record->attachOne[$column->columnName] otherwise in "columns.yaml" in "type: thumb" does not display picture

  • Found the plugin useful on 14 Nov, 2017

    The URL that is generated returns a Page not found error? Do you know what is happening?

    http://kwekerij-muijderman.dev/storage/app/uploads/public/f58/0b0/3e4/thumb__100x100_0_0_auto.jpg

  • author

    Replied on 18 Nov, 2017

    Hi,

    The plugin relies on Octobers built in image resizer. A change on version of 420+ meant the url was stored slightly differently. This has now been fixed with v1.3.5.

    Thanks, Matt

  • Found the plugin useful on 16 Sep, 2017

    I love to use this plugin. But sometime when I try to rescale a lot of pictures, or one big picture I get an 500 Internal Error. I use Nginx and PHP 7.1.9, is there a way to solve this?

    Thank you

  • author

    Replied on 17 Sep, 2017

    Hi, Thanks for using the plugin. Chances are it is exceeding your servers php memory limit when resizing the images. Couple of ideas to get around this:

    Thanks

  • Found the plugin useful on 12 Sep, 2017

    This is a great plug-in that allows for the creator to upload the mega images created by most phones and SLR cameras and then elegantly resample them to optimal size. works like a charm.

  • Found the plugin useful on 12 May, 2017

    Great plugin. Is there a way to clear the cache?

  • author

    Replied on 12 May, 2017

    Thanks

    The clear cache plugin should clear the thumbs for you - https://octobercms.com/plugin/romanov-clearcachewidget

  • Found the plugin useful on 13 Apr, 2017

    Nice plugin, thnx. I was just wondering if theres a method to resize all of the library beforehand, so there would not be any lag when resizing on the go. Thnx

  • author

    Replied on 15 Apr, 2017

    Hi, sorry for the delay.

    Yes, I tend to use the PHP usage either on a schedule or on the onSave/onUpdate controller methods if its a backend form. Just ensure the width/height and settings are identical between the twig and PHP usages to take advantage of the caching.

    Thanks

  • Found the plugin useful on 5 Apr, 2017

    Very useful and practical utility. It gives some new opportunities in using Media Library and optimise media content. I use it a lot especially with TinyPNG. However, it has a peculiarity as well.

    When using RainLab Blog you can apply getThumb to a featured image and you have your thumbs created in the same upload folder where your original file is stored.

    The Image Resizer in this situation creates a new upload folder, copy the original in to it as a file without extension, then creates thumbs there.

    As a result, you have 2 copies of the original file in different folders, double your file structure and used storage space. If your storage is limited, this feature becomes an issue. I am not sure if there is a good reason to keep the second copy of the original file.

  • author

    Replied on 6 Apr, 2017

    Thanks for the feedback. The plugin actually uses the getThumb method you mentioned to resize the images, this is why the original image is copied into the directory.

    I will have a look to see if it's possible to avoid this. I've added it as an issue on the repo (https://github.com/toughdeveloper/oc-imageresizer-plugin/issues/18) so it doesn't get forgotten about.

    Thanks

  • Found the plugin useful on 5 Mar, 2017

    Very Nice, All in one. Note: Make sure image do not have space in it. I struggled for many days to make it working and finally realized that my image file names were like - "Media Lab.jpg".

    I changed it to "Media_Lab.jpg" and everything started working.

  • author

    Replied on 6 Mar, 2017

    Hey,

    Thanks for letting me know. I have added this as an issue to github - https://github.com/toughdeveloper/oc-imageresizer-plugin/issues/15 and will try get a fix together ASAP.

    Update: Unable to replicate, if anyone else is experiencing this issues, please help by adding more information to github issue linked above.

    Thanks, Matt

  • Found the plugin useful on 16 Feb, 2017

    This plugin is freaking amazing. Makes sites so much faster. Not to mention the way you can use it with a shop plugin is just awesome :D

  • Found the plugin useful on 6 Jan, 2017

    Must have!

  • Found the plugin useful on 20 Nov, 2016

    Amazing!

    This should be included in October as a default. I was just looking for this.

  • Found the plugin useful on 18 Nov, 2016

    Very good plugin, but when I try to resize a image like this:

    {{ 'assets/images/myimage.jpg' | theme | resize(200, 200) }}

    The result I get is a image placeholder with the text "Image not Found".

    The relative path (based on theme) is correct. If I remove the resize filter the image works fine. Any idea what maybe causing this?

  • author

    Replied on 19 Nov, 2016

    Hey, thanks for using the plugin.

    Just had a play around and was able to replicate the problem when altering the url setting in config/app.php. For it to work it with the theme filter it needed to be in the format of www.mydomain.tld (no http:// or https://).

    I have fixed it locally to work regardless of the format of the url setting, will get a fix pushed ASAP, in the mean time it should work fine using the full path, e.g:

    {{ 'themes/mytheme/assets/images/myimage.jpg' | resize(500,500) }}

    Please message me if you don't think this is the issue.

    Thanks, Matt

    Update: Bugfix pushed, let me know if the problem persists.

  • Found the plugin useful on 15 Nov, 2016

    A fantastic twig extension!

  • Please login to rate the plugin or write a review.
1.4.1

Only attempt to delete temp files if they still exist - @LukeTowers

May 09, 2020
1.4.0

Add imageWidth() and imageHeight() filters - @matteotrubini

Sep 30, 2019
1.3.6

Prevent infinite loop when custom not found image does not exist. Thanks to yapsr

Mar 25, 2018
1.3.5

!!! Changes path to cached image for builds of October 420+. Thanks to that0n3guy

Nov 17, 2017
1.3.4

Adds German translation - thanks to Christoph (emptynick)

Apr 04, 2017
1.3.3

Updates Hungarian translations - thanks to Szabó Gergő

Feb 07, 2017
1.3.2

Adds option to skip compression of certain images, helpful to save credits.

Jan 30, 2017
1.3.1

Ensures plugin works as expected when October is installed to a sub-directory.

Jan 23, 2017
1.3.0

Adds TinyPNG API key validation, TinyPNG usage statistics and provides thumb backend list column type

Jan 04, 2017
1.2.2

Ensures false can be passed to auto width/height. Also improves URL parsing so different formats of app.url work as expected. Thanks to Emerge.

Dec 20, 2016
1.2.1

Updates translations and allows jpg files to be compressed with Tiny PNG

Dec 19, 2016
1.2.0

Adds optional PNG compression support via Tiny PNG

Dec 08, 2016
1.1.0

Adds default settings to admin - thanks to Szabó Gergő

Nov 23, 2016
1.0.3

Adds Hungarian translation, thanks to INDIKÁTOR

Nov 21, 2016
1.0.2

Fixes bug where url set in config/app.php affecting rendering of image.

Nov 19, 2016
1.0.1

First version of ImageResizer

Nov 08, 2016