Blogger Operator: resizeImage()

Blogger image resize operators are very useful when you want to ensure that an image is displayed in a suitable size. Generally this will be used to get a cropped thumbnail of an image, or to create a responsive image for a mobile-friendly template.

Operator Syntax


resizeImage(imageUrl, newSize, optionalRatio)

Syntax Details


resizeImage
Blogger resize image operator

imageUrl
The original URL of the resizable image.

newSize
The new width of the image

optionalRatio (optional)
The integer ratio of width to height for the resized image, e.g. “1:1” or “4:3”

Fallback


If the imageUrl parameter is not a resizable image, the resizeImage() operator will return the original image URL.

Example Usage


<!-- ie: new image size at 300px -->
<img expr:src=’resizeImage(data:post.firstImageUrl, 300)’ />

<!-- ie: new image size at 600px with ratio 1:1 -->
<img expr:src=’resizeImage(data:post.firstImageUrl, 600, &quot;1:1&quot;)’ />

<!-- ie: new image size at 900px with ratio 4:3 -->
<img expr:src=’resizeImage(data:post.firstImageUrl, 900, &quot;4:3&quot;)’ />



3 comments:

  1. Blogger has been reiterating all the moments and contents for the individuals. The material has been quite good and ideal for the reforms for the people. Blogger is fully aware of the content for the different goals in life.

    ReplyDelete
  2. Thank you. I was looking for a reliable example of the usage syntax for this operator. Most tutorials show it only in a CSS background image. Finally here is a great example of it being used in a standard img tag. Lot of good info in your blog here. I'm sure I'll be referring to it again.

    ReplyDelete

Insert search keyword(s) & press enter...

Subscribe & Get Latest Stories via Mail...

 
Our website development is made possible by displaying online advertisements.
Please consider supporting us & our projects by disabling your Ad Blocker. Thank You.
Our website requires javascripts turned on for best user experience.
Please consider to turn on your web browser javascript. Thank You.
GDPR: Data submitted at our site is managed by 3rd party processors. Read more on how data is collected, managed & processed at our site. Learn More