product_image_uri
The "product_image_uri" function can be used from any Aurora Front-end Template and returns the URI on an image for a product based on the parameters provided.
This article describes how to use this function and its various options.
Overview
This is an Aurora template function to allow embedding of product images into templates.
Aurora supports two different image libraries for hosting your product images
- Aurora
- Amplience
In order to avoid having to recode your templates if you move from different image libraries, we have created a function you can use called {product_image_uri}. If new image libraries are integrated with Aurora these could also be made available through this function and remove the need for template changes.
Currently, this function accepts the following image formats: JPG, PNG or GIF
Parameters
| Parameter | Example | Mandatory | Explanation |
|---|---|---|---|
| width | 100 | Y | The width of the image |
| height | 100 | Y | The height of the image |
| image_id | 1 | N | The ID of the image |
| image_label | Front | N | This should be a valid image label for the product in question. If an image label could not be found for a product, then FALSE is returned instead. |
| product_id | 1 | N | The ID of the product to use. The "main image" of a product will be displayed - unless a further parameter is used, like image_label, to refine image selection. An example of the product_id parameter in use can be found here: https://demo.auroracommerce.com/resizetoheight |
| product | $product.image_id | Y | An array of product data. This is only mandatory if no image_id or product_id is supplied. |
| type | resizeandcrop | N | The way that Aurora will choose to resize an image. This is only applicable to Aurora. Please see Image URI Transformation Types for further information, and examples of usage, regarding the available transformation types. |
| host | www.auroracommerce.com | N | If you are linking to an image via an email or affiliate feed, you will need to include this. |
| resource_url_prefix | http://cdn.auroracommerce.com | N | This allows the entire root URL to be specified. This is usually set to the $resource_url_prefix variable, which is managed internally by Aurora for you. |
| source | aurora | N | Can be used to set the image's source. If not supplied, the system will automatically the best image source to use based on your configuration. Allowed values: "aurora", "amplience" |
| extension | webp | N | Aurora's Image Transformer and supporting CDN allows you to dynamically request your images in a range of formats. To help facilitate this, the "extension" parameter lets you override the file extension with whatever you wish (which then the image transformer must support of course). E.g. you might have uploaded your file as a JPEG, but want to link to it as a WebP file. |
Example Usage
The below examples assume that the user is visiting the domain: visitdomain.co.uk.
Getting the original image
The original image can be returned - with its original aspect ratio and dimensions - by simply not specifying any image processing parameters.
{product_image_uri image_id=1}
If you know the exact image ID
This is an example that can be used on the product details page, when you are looping through all of the thumbnails
If you know the exact image ID
{product_image_uri image_id=$image_id width=900 height=900 extension="webp"}
If you know the product information
This could be if you are showing a product on the product listings page and want to grab the primary image
If you have the product instance
{product_image_uri product=$product width=900 height=900 extension="webp"}
If you only know the product ID
This could be used if you are displaying the image of a product on a content page, where the full product information is not available.
If you only know the product ID
{product_image_uri product_id=123 width=900 height=900 extension="webp"}
If you have the product ID and an Image Label
This can be used to display specific images on the Front-end.
This can only be used with images stored in Aurora. If you use an external image hosting solution, such as Amplience, this feature cannot be used.
{if $product.images_by_label_name.label_1}
<img src="{product_image_uri product_id=123 image_label="Label 1" width=900 height=900 extension="webp"}" />
{/if}
The use of the 'if' statement allows you to confirm there is in fact an image for the desired label before trying to display the image.
Updated over 2 years ago