{%-comment-%} inputs: none dependencies:
[article, post, project, author, page] - one of these must exist in the parent context to render anything site.static_files used to look up the placeholder image and get a list of filenames to check for file existence
local:
item the post, project, or page for which to render the image html placeholder used as the placeholder image for the article card static_file_names used to see if the article image exists image the image to render as the article image alt_text the alt text to use for the image, for screen readers img_title the image title to use for the image
NOTE: github doesn't like the `find` filter - change to `where` for now {%-endcomment-%}
{%-assign item = article | default: post | default: project | default: pg | default: page-%} {%-assign placeholder = site.static_files | where: 'name', 'placeholder.png'-%} {%-assign static_file_names = site.static_files | map: 'name'-%} {%-assign image = item.images.thumbnail.file | default: item.images.default.file | default: item.images.banner.file | default: item.thumbnail | default: item.image | default: item.banner | default: placeholder.first.name-%} {%-assign alt_text = item.images.thumbnail.alt_text | default: item.images.default.alt_text | default: item.images.banner.alt_text | default: item.images.alt_text | default: item.alt_text | default: item.banner.alt_text-%} {%-assign img_title = item.images.thumbnail.title | default: item.images.default.title | default: item.images.banner.title | default: item.images.title | default: item.title | default: item.banner.title-%}
{%-if item != empty %} {%-if static_file_names contains image %} <img src="{{-item.image_path | default: site.image_path-}}{{-image-}}" itemprop="thumbnail" class="u-photo" title="{{-img_title-}}" alt="{{-alt_text-}}"/> {%-elsif image == empty %} <img src="{{-item.image_path | default: site.image_path-}}{{-placeholder.first.name-}}" title="{{-img_title-}}" alt="{{-alt_text-}}"/> {%-else %} <div class="box"><h3>Missing image</h3>{{-image-}}<br>{{-img_title-}}</div> {%-endif %} {%-endif %}