I’m selecting the first image attached to a post and using it in an img tag within my Twig template, like so: <img src="{{ p.media.images|first.cropZoom(1200, 500).url }}"/>
If this is an SVG, then instead of .images, I would use .files, like so: <img src="{{ p.media.files|first.cropZoom(1200, 500).url }}"/>
I’m trying to find a way so that if the first image is a real image file (.jpg, .gif), then do the first, but if the first image is an .svg, then to do the second… How can I ‘filter’ the second so that it would only show an SVG, and not say a PDF, or anything else that might be uploaded?
I’ve searched and cannot find anything to help me do that, and I don’t see anything in the Twig documentation that might help either…
Can anyone shed some light on how this might be achieved please?
@col You could query the properties of page.media.images|first, like
{% if page.media.images|first.mime == "image/jpeg" %}
or
{% if page.media.images|first.type == "image" %}
or
{% if page.media.images|first.extension == "jpg" %}
If you switch on the debugger and dump the file, you will see its properties:
Brilliant, thanks @pamtbaau! That seems exactly what I’ll need. I had no idea those properties even existed! Would you also know if there is a reference of which are available?