From bef4cc90204025ba411d31dc591338d0c9760dd3 Mon Sep 17 00:00:00 2001
From: Heitor Pascoal de Bittencourt <heitorpbittencourt@gmail.com>
Date: Tue, 6 Feb 2024 15:31:27 -0300
Subject: [PATCH] shortcodes: use async and lazy for images.

Zola v0.18 added an option to set all images with `decoding=async` and
`load=lazy`, but this only applies to `<img>` tags generated from
Markdown `![]()` syntax. This patch adds these attributes by default to
`figure` and `image` macros.
---
 templates/shortcodes/figure.html | 2 +-
 templates/shortcodes/image.html  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/shortcodes/figure.html b/templates/shortcodes/figure.html
index e014068..d841b5c 100644
--- a/templates/shortcodes/figure.html
+++ b/templates/shortcodes/figure.html
@@ -1,6 +1,6 @@
 {% if src %}
   <figure class="{% if position %}{{ position }}{% else -%} center {%- endif %}" >
-    <img src="{{ src | safe }}"{% if alt %} alt="{{ alt }}"{% endif %}{% if style %} style="{{ style }}"{% endif %} />
+    <img src="{{ src | safe }}"{% if alt %} alt="{{ alt }}"{% endif %}{% if style %} style="{{ style }}"{% endif %} decoding="async" loading="lazy"/>
     {% if caption %}
       <figcaption class="{% if caption_position %}{{ caption_position }}{% else -%} center {%- endif %}"{% if caption_style %} style="{{ caption_style | safe }}"{% endif %}>{{ caption | markdown() | safe }}</figcaption>
     {% endif %}
diff --git a/templates/shortcodes/image.html b/templates/shortcodes/image.html
index 091eeb8..7a2f044 100644
--- a/templates/shortcodes/image.html
+++ b/templates/shortcodes/image.html
@@ -4,5 +4,5 @@
     {# ... then prepend the site's base URL to the image's URL. #}
     {% set src = config.base_url ~ src %}
   {% endif %}
-  <img src="{{ src | safe }}"{% if alt %} alt="{{ alt }}"{% endif %} class="{% if position %}{{ position }}{% else -%} center {%- endif %}" {%- if style %} style="{{ style | safe }}" {%- endif %} />
+  <img src="{{ src | safe }}"{% if alt %} alt="{{ alt }}"{% endif %} class="{% if position %}{{ position }}{% else -%} center {%- endif %}" {%- if style %} style="{{ style | safe }}" {%- endif %} decoding="async" loading="lazy"/>
 {% endif %}