Controlling Image Resizing

Controlling Image Resizing

Using the <ss:standard:image /> tag

The <ss:standard:image> tag is a replacement for the standard HTML <img
/> tag.

When it's src attribute is referenced to an image stored on the website, it will automatically generate a thumbnail at the dimensions of the
width
and height attributes specified.

Standard html <img> tag attributes all work with the <ss:standard:image> tag (eg. class, style), with the addition of a few
extra attributes:

Src - The location of the image. This should be referenced relative to the website root domain. For example; src="/media/website_pages/about-us/img1.jpg".

Width - The width of the image in pixels. Do not include 'px'. For example; width="200", rather than width="200px".

Height - The height of the image in pixels.
Again, do not include 'px'.

MaintainAspect - When the image is being resized, this attribute determines whether or not the aspect ratio is maintained. The available values are "crop", "true" and "false" (default: true). When this attribute is set to crop, the image will be cropped to that of the smallest dimension while maintaining aspect ratio.

Using the API - Background Images

You can also generate an image thumbnail using the API, for those times when an <img /> tag is not appropriate. For instance, you might want to generate a thumbnail for use in a style attribute or custom jQuery gallery.