There are currently three Image templates:

• Image
• Bare Image
• Annotate Image

This article describes these templates and explains which template you should use in different scenarios.

When do I use which template?

Image

This is the default template. Like all templates that were cleaned up by the Template Working Group, it contains a wrapper div with a class and an ID, and an anchor.

This means that when this template is selected for the image, it wraps a div around the img tag. This is useful if you want to display the image on a page, since it gives you a block element (the div) instead of an inline element (the img tag). This makes positioning the image easier.

It also gives you more styling options (e.g. a double border) and you can make CSS specifically for Image Assets. Thus you can style them differently from other images on the page, like those added with the editor.

Bare Image

But al this extra HTML around the image is not always necessary and sometimes unwanted. For example: an AssetProxy macro is used to add an image to the header of the page. In that case usually only the img tag is required. This is what the Bare Image template does: it only returns an img tag.

Annotate Image

In WebGUI, an annotation can be added to an area of the image. This can be done by editing the Image and clicking Annotate image in the menu on the right. The Annotate Image template adds some javascript to display the annotation.