How can I resize images in my widget.

You can use the image processor to parse the images.

IMAGE PROCESSOR

The image processor is a program inside extenso that allow you to manipulate image. You will be able to CROP, RESIZE and COMPRESS images on the website.

You can use it directly in the code of you widget when you display or you can use it in a program that will generate image to your parameters.

Image processor will generate a new version of the image corresponding to the parameters. This will generate the image once and only in staging.

PARAMETERS

Some of the available parameters :

• type = to choose the file type.
• Quality = 0 to 100 for quality of the compression of jpeg
• maxh or maxw = Maximum width or height
• minh or minw = Minimum width or height
• size = Specific dimension for the image.
• H = set specific height and automatic width
• w = set specific width and automatic height
• crop = string or no value
• …

More information :
/extenso/module/sed/image_processor/README.md
 

Examples

Simple example :
The result below will only change the image to have be 200 max width.
image_name.jpg?maxw=200
<img src=’{_{data.rows.image}}?maxw=200’>

 

Resize and add margin example :
the result will be a 200x200 image not distorted with margin in black.
image_name.jpg?size=200x200&margins&bgcolor=0,0,0
<img src=’{_{data.rows.image}}?size=200x200&crop&margins&bgcolor=0,0,0’ >

 

Crop example :
The result will be a 200x200 image with no margin. So the image will be crop from the center to fit the area.
image_name.jpg?size=200x200&crop&margins
<img src=’{_{data.rows.image}}?size=200x200&crop&margins’>