plugin: Image Sizer
Development and Programming
Like many others, I love this plugin and have found it to be an absolute lifesaver on many projects. However, there is one little thing about it that, for the life of me, I can’t figure out.
I’ve got a site with a text field for images (I’m using EE’s built-in file uploader to add images to the site, rather than something like nGen’s File Upload filed or Mark Huot’s “File” extension). Here’s a typical entry into this field:
https://ellislab.com/asset/images/team-photo/foo.jpgAs you can see, the field contains the entire IMG tag, and not just the image’s URL. Obviously, that won’t work with the Imgsizer plugin. So I’m trying to use the “Extract URL” plugin to pull out the URL and input that into the Imgsizer plugin, like so:
{exp:imgsizer:size src="{exp:extract_url}{image_field}{/exp:extract_url}" width="100" height="100" alt="" class="" base_cache="/www/foo/bar/images/sized/" quality="90"}This doesn’t work. When I look at the template debugging code, this is what I find:
(0.140069) Tag: {exp:imgsizer:size src="M00o93H7pQ09L8X1t49cHY01Z5j4TT91fGfr" width="100" base_cache="/www/foo/bar/images/sized/" height="100" alt="" class="" quality="90"}I’ve also tried using PHP to input the image’s URL into the plugin, like so:
<?php
$image_field = "{exp:extract_url}{image_field}{/exp:extract_url}";
echo($image_field);
?>
{exp:imgsizer:size src="<?php echo($image_field); ?>" width="100" height="100" alt="" class="" base_cache="/www/foo/bar/images/sized/" quality="90"}Which doesn’t work, either, regardless of whether the template’s PHP processing mode has been set to “input” or “output”. And when I look at the template debugging code, I see the same output as I mentioned above, where some gobbledygook is being passed into the plugin’s “src” parameter.
Strangely enough, when I “hardcode” an image URL, then everything works fine:
{exp:imgsizer:size src="<?php echo 'http://domain.com/images/uploads/foo.jpg'; ?>" width="100" height="100" alt="" class="" base_cache="/www/foo/bar/images/sized/" quality="90"}I can get around this by placing the Imgsizer plugin in an embedded template and passing parameters to it, like so:
{embed="global/.imgsizer" url="{exp:extract_url}{image_field}{/exp:extract_url}" width="100" height="100"}But if I use this for an entry that has multiple image fields, the multiple instances of the embedded template can add some overhead to the site’s performance, which I’d like to avoid as much as possible.
Any ideas? I’m using Image Sizer v.2.5.5 and EE 1.6.8, FWIW.
I think the problems are parsing issues - you can’t have an extension call in another extension call and you can’t have an extension set a php variable which then sets another extension, it’s either php first then EE, or the other way around.
Try this:
{embed=template_group/image-resize fileurl="{exp:extract_url}{image_field}{/exp:extract_url}"}then in a new template (Edit: referenced above - e.g. “image-resize”) use this:
{exp:imgsizer:size src="{embed:fileurl}" width="100" height="100" alt="" class="" base_cache="/www/foo/bar/images/sized/" quality="90"}
I solved my issue…or rather the guru I have access to on this project did…the stupid /images/sized folder.
To be honest, I think the instructions for the imgsizer plugin need to make it clear that this folder needs to exist and have the right permissions! Because this was an obvious stupid duh moment, but also, it’s rather buried in the instructions!
I think the problems are parsing issues - you can’t have an extension call in another extension call and you can’t have an extension set a php variable which then sets another extension, it’s either php first then EE, or the other way around.
That’s what I was afraid of. Guess I’m “stuck” with using an embedded template, like you mentioned.
Thanks for the help.
@Jason, out of interest you mention:
the multiple instances of the embedded template can add some overhead to the site’s performance
How have you measured this and is it really that noticable? (sorry bit off topic)
Well, on the site in question, I have a little module that appears in a side column that displays thumbnails of images associated 8 most recent entries/reviews. I use Imgsizer to create those thumbnails. So that’s basically 8 additional template calls for each page load, since I’m using an embedded template for the Imgsizer plugin. And I can’t cache that template, otherwise it’ll return the same thumbnail 8 times.
And that’s not counting the number of times that I might use the embedded template within my primary entries.
Admittedly, 8 additional template calls isn’t a lot, and the site in question isn’t sluggish by any means. But these template calls just feel unnecessary to me, and being the obsessive compulsive that I am, it just irks me a little that I can’t get rid of them.
@KKCJ *snip* This is untested, so no guarantees! It will only leave your image at it’s current size if both the height and width are less than that specified.
Hey, thanks for pointing me in the right direction. Unfortunately, your code was unnecessary… sort of. :p You modified the plugin to prevent upscaling if width or height was specified. However, that first clause, at line 393, already prevents upscaling! It was my fault - I should have specified that it’s when you use the ‘auto’ parameter that the plugin upscales images, not when using ‘width’ or ‘height’.
But anyway, you did point me to the right area of the code… and a few hours later (it took me a while to figure out the above unnecessary-ness), I’ve modified the plugin in a number of ways, all of them basically adding support for a new parameter, upscale=’yes|no’.
Originally, when specifying only width or only height, the plugin wouldn’t upscale the image. However, when specifying both width and height (plugin crops image to specified dimensions), or when using the “auto” parameter, the plugin would upscale images smaller than the specified dimensions.
Now, with “upscale”, you can control this behavior. Assume a source image of 200x100 (WxH).
This would normally not upscale the image:
{exp:imgsizer:size src="example.jpg" width="400"}This will:
{exp:imgsizer:size src="example.jpg" width="400" upscale="yes"}This normally would upscale the image:
{exp:imgsizer:size src="example.jpg" auto="300"}This will prevent upscaling:
{exp:imgsizer:size src="example.jpg" auto="300" upscale="no"}This also would normally upscale the image (would upscale to 300 wide, then crop from top and bottom everything but the center 50, resulting in an image 300x50):
{exp:imgsizer:size src="example.jpg" width="300" height="50"}This too will prevent upscaling (leaves width alone, crops off top and bottom, resulting in an image 200x50):
{exp:imgsizer:size src="example.jpg" width="300" height="50" upscale="no"}In all cases, omitting the “upscale” parameter will retain the current behavior - nothing will change in a site unless you specify the “upscale” parameter.
I hope this helps y’all! Please test it and let me know of any bugs relating to the new parameter. Lumis, you are, of course, more than welcome to make use of this - or not, as you see fit.
Is there anyway to supply a height and a width and not have it exceed those and not crop?
Is there anyway to supply a height and a width and not have it exceed those and not crop?
Please take a look at my post. http://ellislab.com/forums/viewthread/62138/P504/#618093
It doesn’t upscale & crop.
Is there anyway to supply a height and a width and not have it exceed those and not crop?Please take a look at my post. http://ellislab.com/forums/viewthread/62138/P504/#618093 It doesn’t upscale & crop.
Need an option that crops/resize from the top left, not center? That make sense?
Maybe being able to specify by corner, and when not specified, it will default to middle?
{exp:imgsizer:size image="{image}" width="322" height="197" alt="{caption}" corner="top-left"}or
{exp:imgsizer:size image="{image}" width="322" height="197" alt="{caption}" corner="bottom-right"}Maybe being able to specify by corner, and when not specified, it will default to middle?or{exp:imgsizer:size image="{image}" width="322" height="197" alt="{caption}" corner="top-left"}{exp:imgsizer:size image="{image}" width="322" height="197" alt="{caption}" corner="bottom-right"}
Hmm.. Maybe i will look into it later, i personally don’t see the use at this moment, but if i have the time.
Something new, i’ve modified the sourcecore again and added the sharpen=”yes” option to the plugin. This will sharpen the image.
I’m using this function: http://vikjavev.no/computing/ump.php
Amount:40 Radius:0.5 Threshold:3 I haven’t made it configurable, but it should be ok. It adds a subtle sharpening, if you want more, edit the plugin on line 622.
(please clear your sized images directory so it can create the new images)
Note: Just to state te obvious, the copyrights stay with lumis.
I keep getting these errors when I use the plug-in:
Notice: getimagesize(): Read error! in /path/to/system/plugins/pi.imgsizer.php on line 151The sized images actually are appearing fine though. Just their path is very odd: /images/uploads/sized/images/uploads/ Yes, it’s repeating.
Hello everybody,
just trying to set the quality parameter for my thumbs, but it doesn’t seem to work.
If I set quality=”50” or quality=”100” I get the same low quality thumbs.
Do I miss something?
I keep getting these errors when I use the plug-in:The sized images actually are appearing fine though. Just their path is very odd: /images/uploads/sized/images/uploads/ Yes, it’s repeating.Notice: getimagesize(): Read error! in /path/to/system/plugins/pi.imgsizer.php on line 151
I am also getting this same error. It is happening where i have an if statement (if the image exists, run image sizer, if not display a default image). But i assume imgsizer runs before the template if statements are made so it doesnt find the image file and causes an error?
Any idea how to fix this?