You can, of course, also link to images. Modals will recognize links to images and adjust the styling of the modal window a bit to accommodate this.
By default Modals will convert the image filename to a Title, and show it on top of the modal popup.
{modal url="images/fruit/bananas.jpg"}This is an image{/modal}
But you can of course override it with your custom one:
{modal url="images/fruit/bananas.jpg" title="Totally bananas"}This is an image with a custom title{/modal}
If you do not want any title to show at all, you can switch off the "Auto Titles" option in the Modals system plugin settings.
Or add the auto-titles="false"
attribute to the specific {modal}
tag.
{modal url="images/fruit/bananas.jpg" auto-titles="false"}This is an image with no title{/modal}
Thumbnail link PRO
In addition, the Pro version of Modals provides you with the ability to display a thumbnail as clickable link to the image modal.
You can do so by using the image
attribute and without placing any text between the {modal}
tags, like:
By default, the dimensions of the automatically created thumbnail will be based on your default settings. However, you can also individually customize the width and height of the thumbnail for each specific image modal, by using the thumbnail-width
and thumbnail-height
attributes: