VariablesLast updated: 12 November 2025

JCOGS Image Pro makes a large number of variable elements available for each image that it processes.

Variable elements can be included within an output= parameter, and or included within a JCOGS Image Pro tag-pair, and can be used to help construct either custom <img> or <picture> tags, or generate other forms of useful output within your template (such as picture captions).

If you use a tag suffix to differentiate nested levels of Pair tags you can access variables from specific nested levels by prefixing the variable with the appropriate tag suffix used. So for example this tag uses a differently processed image for browsers that have scripting enabled compared to those that do not:

{exp:jcogs_img_pro:pair src="{image}" width="{image_width}" height="{image_height}" crop="yes" allow_scale_larger="yes" save_type="jpg"}

    {exp:jcogs_img_pro:pair:inner src="{another_image}" width="{another_image_width}" height="{another_image_height}" crop="yes" allow_scale_larger="yes" quality="85"} 
            <img src="{inner:made}" data-src="{made}" width="{width}" height="{height}">
            <noscript>
                &amp;amp;amp;amp;amp;amp;amp;amp;lt;img src="{made}" class="image" width="{width}" height="{height}"&amp;amp;amp;amp;amp;amp;amp;amp;gt;
            </noscript>
    {/exp:jcogs_img_pro:pair:inner}
{/exp:jcogs_img_pro:pair}

Base64 output

Currently the only way to generate base64 output is via a JCOGS Image Pro variable.

aspect_ratio

CE Image Compatibility: New feature

The aspect ratio of the processed image.

Syntax

{aspect_ratio}

aspect_ratio_orig

CE Image Compatibility: New feature

The aspect ratio of the source image.

Syntax

{aspect_ratio_orig}

attributes

CE Image Compatibility: Full

Contains content of attributes parameter if set, plus any unrecognised parameters in the tag, plus for tag-pair operations any non-JCOGS Image Pro variables and unrecognised parameters enclosed by the tags.

Syntax

{attributes}

Illustration

The JCOGS Image Pro tag:

{exp:jcogs_img_pro:image src="{images}" width="300" attributes="style='margin-top:3em'" class="cats" data-mood="fierce"} class="eggs" data-type="lions" {attributes} {/exp:jcogs_img_pro:image}

will add result in the class, style and other non-standard tag parameters being represented like this

data-type="lions" data-mood="fierce" class="cats eggs" style="margin-top:3em"

Explanation: Parameters that JCOGS Image Pro does not recognise that are within the JCOGS Image Pro tag or are enclosed by a JCOGS Image Pro tag pair are simply collected up and passed straight into the {attributes} variable. Any class= or style= parameters found within the tag or enclosed by the tag pair are collected up and then reconciled before being added to the {attributes} variable to ensure that there is just one instance of each of these two parameters presented in the output variable.

average_color

CE Image Compatibility: Full

Returns the average colour present in the processed image in hexadecimal colour format.

Syntax

{average_color}

base64

CE Image Compatibility: Full

Provides a base64 encoded version of the processed image after any JCOGS Image Pro tag parameters have been applied to the source image.

Syntax

{base_64}

base_64_orig

CE Image Compatibility: Full

Provides a base64 encoded version of the source image - i.e. before JCOGS Image Pro tag parameters have been applied.

Syntax

{base_64_orig}

dominant_color

CE Image Compatibility: New feature

A relative link to a dominant colour version the processed image.

For more information on Dominant Colour images see the Advanced Topic “Lazy Loading”, the documentation for the “lazy” parameter, or for the filter “dominant_color”.

Syntax

{dominant_color}

extension

CE Image Compatibility: Full

The filename extension of the processed image.

Syntax

{extension}

extension_orig

CE Image Compatibility: Full

The filename extension of the source image.

Syntax

{extension_orig}

filesize

CE Image Compatibility: Full

The size of the processed image in power based units (e.g. Kbytes)

Syntax

{filesize}

filesize_bytes

CE Image Compatibility: Full

The filesize of the processed image in bytes.

Syntax

{filesize_bytes}

filesize_bytes_orig

CE Image Compatibility: Full

The filesize of the source image in bytes.

Syntax

{filesize_bytes_orig}

filesize_orig

CE Image Compatibility: Full

The filesize of the source image in power based units (e.g. Kbytes)

Syntax

{filesize_orig}

height

CE Image Compatibility: Full

The height in pixels of the processed image.

Syntax

{height}

height_orig

CE Image Compatibility: Full

The height in pixels of the source image.

Syntax

{height_orig}

img_credit

CE Image Compatibility: New feature

Provides access to the Credit field associated with this image in the EE Files storage system.

If image does not originate on the local EE system this value is ignored.

Syntax

{img_credit}

img_description

CE Image Compatibility: New feature

Provides access to the Description field associated with this image in the EE Files storage system.

If image does not originate on the local EE system this value is ignored.

Syntax

{img_description}

img_location

CE Image Compatibility: New feature

Provides access to the Location field associated with this image in the EE Files storage system.

If image does not originate on the local EE system this value is ignored.

Syntax

{img_location}

img_title

CE Image Compatibility: New feature

Provides access to the Title field associated with this image in the EE Files storage system.

If image does not originate on the local EE system this value is ignored.

Syntax

{img_title}

lazy_image

CE Image Compatibility: New feature

A relative link to a lazy loading placeholder image chosen for a tag - either the Low Quality Image Placeholder (LQIP) or the Dominant Colour version of the image depending on what options have been chosen for this tag / server.

Syntax

{lazy_image}

lqip

CE Image Compatibility: New feature

A relative link to a low quality image placeholder version the processed image.

For more information on LQIP images see the Advanced Topic “Lazy Loading”, the documentation for the “lazy” parameter, or for the filter “lqip”.

Syntax

{lqip}

made

CE Image Compatibility: Full

Provides the relative path from the web_root folder to the cached copy of the processed image.

Syntax

{made}

made_url

CE Image Compatibility: Full

Provides a full URL pointing at the cached copy of the processed image.

Syntax

{made_url}

made_with_prefix

CE Image Compatibility: New feature

Provides the path from the web_root folder to the cached copy of the processed image inclusive of any image_path_prefix that has been defined.

Syntax

{made_with_prefix}

mime_type

CE Image Compatibility: New feature

Returns the mime type of the processed image.

Syntax

{mime_type}

name

CE Image Compatibility: Full

The name of the processed image (without extension).

Syntax

{name}

name_orig

CE Image Compatibility: Full

The name of the source image file (without extension).

Syntax

{name_orig}

orig

CE Image Compatibility: Full

Provides the relative path from the web_root folder to the source image (if available).

Syntax

{orig}

orig_url

CE Image Compatibility: Full

Provides a full URL pointing at the source image (if it is available).

Syntax

{orig_url}

path

CE Image Compatibility: Full

Provides the full local path to the cached copy of the processed image.

Note: Only provides this output if the File System Adapter is set to “local”, otherwise returns blank.

Syntax

{path}

path_orig

CE Image Compatibility: Full

Provides the full local path to the source image (if available).

Syntax

{path_orig}

preload

CE Image Compatibility: New feature

If included in a tag-pair construct, or the content of the output= parameter will cause JCOGS Image Pro to add a preload request to the <head> section of the HTML page the <img> tag appears on. This causes the image to downloaded immediately on page load - an approach that may reduce the time to “Largest Contentful Paint” (LCP) and is widely supported by browsers.

Syntax

{preload}

save_type

CE Image Compatibility: Full

save_type is an alias of format parameter: it determines the encoding format to be used by the processed image.

The format options available are determined by the abilities of the php image processing library used on the server running the EE instance. JCOGS Image Pro actively monitors the available formats and only makes available formats that are supported: the formats available are listed in the JCOGS Image Pro Control Panel settings page in the drop-down for ‘Default Image Format’ (which also ensures that the Default Image Format is always one that can be processed by the server!).

If you specify an image format in a JCOGS Image Pro format that is not supported by the server, JCOGS Image Pro will use the Default Image Format to encode the image instead, or will retain the format of source if a default is not specified.

For GD2 (the default library used by JCOGS Image Pro) commonly available formats include:

extension	image format
avif	AV1 Image File Format
bmp	Windows bitmap format
gif	Graphics Interchange Format
jpeg/jpg	JPEG image format
png	Portable Network Graphics
webp	Webp

For an image to be seen in a browser it is also important that the browser viewing the web page also supports the image format chosen. Where possible, when processing an image JCOGS Image actively checks that the current browser is able to display the format chosen; if the browser would not be able to display the image format chosen JCOGS Image substitutes a format that is supported both by the server and the browser (usually JPG).

The choice of which image formats to use when is a complex discussion area, and outside the scope of this manual to consider.

Syntax + Examples

save_type="bmp|gif|jpeg|jpg|png|webp" - Default: jpg

save_type="bmp"

save_type="webp"

Usage Notes

Transparency

Not all formats support transparency. Where possible transparency in images is preserved by JCOGS Image Pro during processing, but it is also important to make sure that the processed image is saved in a format that also supports transparency: in particular if you are manipulating a PNG image with transparency and wish the processed image to retain this transparency, make sure you specify save_type="png" in your tag.

Not all filter operations preserve transparency.

When transparency is removed during a operation, the transparent pixes are replaced by pixels coloured according to whatever colour is chosen as the default background colour.

Usage Notes

Lossy vs Lossless

JCOGS Image Pro always attempts to save images using the smallest file size option available for any given format. So for PNG and WebP images which support both lossy and lossless image storage formats, the images are saved using the lossy (compressed) format.

When JCOGS Image Pro is run on a server providing php 8.1, when a webp format image is saved with a quality value of 100 it will be saved in webp's lossless image format.

Usage Notes

Static Caching vs. Image Format Detection

JCOGS Image Pro will actively attempt to ensure that your images are presented to a browser in a format that the browser can read. However for this active engagement to work, JCOGS Image Pro has to be able to communicate with the browser. Due to how static caching works, JCOGS Image Pro will not be able to make any adjustments to the images sent to a browser on pages that are in a static cache, and so you should be cautious about what image format you choose for pages that will be delivered in this way.

One option is to specify ‘safe’ formats (such as JPG, PNG, GIF) for your images - these formats have effectively universal support.

Another option is to code up your pages using the HTML <picture> tag - which lets you specify multiple formats for the same image, and the browser can then choose a version it can read from those offered.

A future update to JCOGS Image Pro will add in the ability to auto-generate <picture> tags for this purpose, but for now you will need to code up your own versions, making use of JCOGS Image Pro variables to construct the tags to your liking.

Usage Notes

SVG Format

JCOGS Image Pro currently provides limited support for SVG files. That support does not currently include the ability to convert images from or to the SVG format, and so if you specify svg as the save_type this value will be ignored and the default image format will be used instead.

sizes_param

CE Image Compatibility: New feature

Contains the fully constructed HTML <img> sizes= parameter for inclusion in a constructed tag based on the srcset= parameter included in the opening tag.

Syntax

{sizes_param}

srcset_param

CE Image Compatibility: New feature

Contains the fully constructed HTML <img> srcset= parameter for inclusion in a constructed tag based on the srcset= parameter included in the opening tag.

Syntax

{srcset_param}

type

CE Image Compatibility: Full

The image format used for the processed image.

Syntax

{type}

type_orig

CE Image Compatibility: Full

The image format used for the source image.

Syntax

{type_orig}

width

CE Image Compatibility: Full

The width in pixels of the processed image.

Syntax

{width}

width_orig

CE Image Compatibility: Full

The width in pixels of the source image.

Syntax

{width_orig}