Images

The image tag outputs an ...image! It consists of one or more parts (separated by a pipe symbol), enclosed in double curly braces:

{{src|WxH|:format|~class|alt}}

The above is transformed into the following HTML equivalent:

<img src="src" width="W" height="H" class="class" alt="alt" title="alt" />

All parts are optional but at least one of them must be present (otherwise no parsing will occur). They can appear in any order, except src (it must be the first).

src

Specifies the image URL. It can be any of the following:

• an uploaded image id
  {{1}}                             ➩
• any combination of image id ranges (x-y) and lists (x,y,...,z)
  {{1,27-31|0x16}}                  ➩
• an icon id
  {{icon1610}}                      ➩
• the word "logo" (displays the active logo)
  {{logo|0x16}}                     ➩
• the phrase "google_static_map" (displays your location)
  {{google_static_map|0x16}}        ➩
• a dynamic image
  {{img/gradient?hgt=16}}           ➩
• a static image, from the var/img zoglair directory
  {{%img%/misc/sm_folder.png}}      ➩
• an external URL
  {{http://www.aca.gr/favicon.ico}} ➩
• if left empty, the default image with id=8 will be output
  {{|0x16}}                         ➩

WxH

Specifies the image dimensions, delimited be a lower-case latin x. W and H can be an arbitrary size (in pixels), one of zoglair symbolic sizes (see below), or 0 (zero). If one of the dimensions is zero, it is calculated relatively to the non-zero one. If the resulting image is much smaller than the original, zoglair automatically produces a (zoomable) thumbnail, so that page rendering is speed up. Obviously, this can only be true for uploaded images. External images are of unknown size, unless it is encoded in their filename as ".WxH.", for example: an_image.100x200.png. Still, you can use a zero dimension for any external image, to constrain its width or height. If both dimensions are entered, then the resulting image will retain its aspect ratio - no matter what - if it is uploaded (since its size is known), but it will be distorted if it is external. The following symbolic sizes are defined:

    ico ➩ 40

    sml ➩ 60

    med ➩ 90

    big ➩ 136

    ful ➩ 100%

:format

Orders a specific markup, for use in special cases. It can be any of the following:

• :src
  Only the src attribute is output. This can be useful in templates. The resulting URL is relative (as all zoglair URLs in HTML output).
• :url
  Similar to src, except the resulting URL is absolute. This is used in CSS backgrounds.
• :rgb
  Only the average image color (in RGB format) is output, as listed in the relative Upload grid column. This is useful in specifying solid background colors in CSS.
• :img
  This is used for avoiding a zoomable thumbnail (if applicable), so only the <img ... /> tag is output.
• :bap
  Enforces a (non-zoomable) thumbnail, with the specified dimensions. This is used when either the resulting or original image size is too small for zoglair to activate the automatic thumbnail generation.
• :N (where N is an integer)
  Handles the src image as a CSS sprite and generates inline styling to display the Nth item. In such a case, the “tags” field of the image's upload record needs to have a certain format. Please, see the Upload table for details.

~class

One or more CSS classes (space delimited). If left empty, the class attribute will be omitted.

alt

The image alternative text attribute. If supplied, it is also used for its title (~tooltip). There is no need to specify this for uploaded images, as zoglair uses their title by default.