Load images async
This commit is contained in:
parent
3f9288f5cb
commit
309955a052
7 changed files with 10 additions and 7 deletions
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
<figure>
|
<figure>
|
||||||
<div class="image is-16by9">
|
<div class="image is-16by9">
|
||||||
<img src="{% image_url value.image 'width-1500' %}" alt="{{ value.caption|richtext|extract_text }}" />
|
<img src="{% image_url value.image 'width-1500' %}" alt="{{ value.caption|richtext|extract_text }}" loading="lazy" decoding="async" />
|
||||||
</div>
|
</div>
|
||||||
<figcaption>
|
<figcaption>
|
||||||
{{ value.caption|richtext }}
|
{{ value.caption|richtext }}
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
<figure class="media-left column is-3 image-column">
|
<figure class="media-left column is-3 image-column">
|
||||||
{% if page.list_image_url %}
|
{% if page.list_image_url %}
|
||||||
<a href="{% pageurl page %}" class="image">
|
<a href="{% pageurl page %}" class="image">
|
||||||
<img src="{{ page.list_image_url }}">
|
<img src="{{ page.list_image_url }}" loading="lazy" decoding="async" />
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</figure>
|
</figure>
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
|
|
||||||
{% block main_content %}
|
{% block main_content %}
|
||||||
{% if page.hero_image_url %}
|
{% if page.hero_image_url %}
|
||||||
<img class="hero" src="{{ page.hero_image_url }}">
|
<img class="hero" src="{{ page.hero_image_url }}" decoding="async" />
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<section class="hero">
|
<section class="hero">
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
<figure>
|
<figure>
|
||||||
<div class="image">
|
<div class="image">
|
||||||
<img src="https://mermaid.ink/svg/{{ value.pako }}" referrerpolicy="no-referrer" alt="{{ value.caption|richtext|extract_text }}" />
|
<img src="https://mermaid.ink/svg/{{ value.pako }}" referrerpolicy="no-referrer" alt="{{ value.caption|richtext|extract_text }}" loading="lazy" decoding="async" />
|
||||||
</div>
|
</div>
|
||||||
<figcaption>
|
<figcaption>
|
||||||
{{ value.caption|richtext }}
|
{{ value.caption|richtext }}
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<a class="item-choice" href="{{ row.choose_url }}">
|
<a class="item-choice" href="{{ row.choose_url }}">
|
||||||
<img src="{{ row.item.get_thumbnail_url }}" width="165"/>
|
<img src="{{ row.item.get_thumbnail_url }}" width="165" referrerpolicy="no-referrer" decoding="async" />
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
<td class="title">
|
<td class="title">
|
||||||
|
|
|
@ -72,7 +72,7 @@ class UnsplashPhotoAdmin(ModelAdmin):
|
||||||
|
|
||||||
def thumbnail(self, instance: UnsplashPhoto) -> str:
|
def thumbnail(self, instance: UnsplashPhoto) -> str:
|
||||||
return format_html(
|
return format_html(
|
||||||
"<img src='{}' width=165 class='admin-thumb'/>",
|
"<img src='{}' width=165 class='admin-thumb' loading='lazy' decoding='async' />",
|
||||||
instance.get_thumbnail_url(),
|
instance.get_thumbnail_url(),
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
|
@ -13,4 +13,7 @@ class UnsplashPhotoChooser(AdminChooser):
|
||||||
choose_modal_url_name = "unsplash_photo_chooser:choose"
|
choose_modal_url_name = "unsplash_photo_chooser:choose"
|
||||||
|
|
||||||
def get_title(self, instance: UnsplashPhoto) -> str:
|
def get_title(self, instance: UnsplashPhoto) -> str:
|
||||||
return format_html("<img src='{}' width=165>", instance.get_thumbnail_url())
|
return format_html(
|
||||||
|
"<img src='{}' width=165 loading='lazy' decoding='async'>",
|
||||||
|
instance.get_thumbnail_url(),
|
||||||
|
)
|
||||||
|
|
Loading…
Reference in a new issue