Asset Wrapper

Asset wrappers provide the properties and methods for interfacing with assets via your twig templates. You will be working with an \Enact\template\wrapper\Asset instance whenever you are interacting with an asset field.

Asset Properties#

  • id – The unique ID of the asset.

  • userId – The unique ID of the user who uploaded the asset.

  • title – The title of the asset.

  • fileName – The physical file name of the asset.

  • fileSize – The human friendly file size.

  • fileSizeInt – The size of the file as an integer.

  • extension – The extension of the asset.

  • type – The assets type.

  • url – The url where the asset is located.

  • width - The width of the asset (only applicable to image assets).

  • height - The heigth of the asset (only applicable to image assets).

  • lastModified – The last modified date of the asset.

  • createdOn – The date the asset was created.

  • groupId – The id of the asset group the asset is contained in.

  • groupName – The name of the asset group the asset is contained in.

  • groupHandle – The handle of the asset group the asset is contained in.

  • groupFolder – The folder name of the group the asset is contained in.

  • thumbFolder – The folder name the assets thumbnail is contained in.

  • entryId – The entry id of the asset.

Accessing properites

{% set asset = entry.yourFieldHandle.assetFieldHandle[0] %}

<p>File size : {{ asset.fileSize }}</p>

<p>File URL : {{ asset.url }}</p>

<p>File Type : {{ asset.type }}</p>

Asset Methods#

  • getImgHtml – Get a <img> element with the appropriate src and title properties set (only applicable to image assets).

  • getLinkHtml – Get a <a> element with the appropriate href and title properties set.

  • getVideoHtml - Get a <video> element with the appropriate src property set (only applicable to video assets).

  • getAudioHtml - Get a <audio> element with the appropriate src property set (only applicable to audio assets).

  • hasThumb – Returns whether or not the asset has a thumbnail.

  • getThumbUrl – Get the url of the assets thumbnail.

  • getImgThumbUrl - Get a <img> element of the asset thumbnail with the appropriate src and title properites set.

  • getEntry – Returns the \Enact\template\wrapper\Entry representing the entry the asset is associated with (if the asset doesn't have an entry it will return null).

Using the methods

{% for asset in entry.yourFieldHandle.assetFieldHandle %}

    {{ asset.getLinkHtml }} // Will ouput <a href='/path/to/asset.png'>Assets Title</a>

    // You can also pass attributes to the html methods (getImgHtml,getLinkHtml,getAudioHtml,getLinkHtml)

    {{ asset.getImgHtml({ 'class' : 'img-class large'}) }}

    // Will output <img src='/path/asset.jpg' class='img-class large' title='Asset title'/>

{% endfor %}

If you call the field without any properties or methods and the asset is an image, it is equivalent to calling the getImgHtml method, for all other asset types its the equivalent of calling the getLinkHtml method.

<p>Download the document here: {{ entry.yourFieldHandle }}</p>

<p>Check out this beautiful picture!</p>

{{ entry.yourFieldHandle }}