- {% include figure.liquid path=project.img sizes="(min-width: 768px) 156px, 50vw" alt="project thumbnail" %}
+ {% include figure.liquid loading="eager" path=project.img sizes="(min-width: 768px) 156px, 50vw" alt="project thumbnail" %}
diff --git a/_layouts/about.liquid b/_layouts/about.liquid
index 4d986f852bbb..dc669b6bd88a 100644
--- a/_layouts/about.liquid
+++ b/_layouts/about.liquid
@@ -28,8 +28,8 @@ layout: default
{% capture sizes %}(min-width: {{site.max_width}}) {{ site.max_width | minus: 30 | times: 0.3}}px, (min-width: 576px)
30vw, 95vw"{% endcapture %}
{%
- include figure.liquid path = profile_image_path class = profile_image_class sizes = sizes alt = page.profile.image
- cache_bust = true
+ include figure.liquid loading="eager" path=profile_image_path class=profile_image_class sizes=sizes alt=page.profile.image
+ cache_bust=true
%}
{% endif %}
{% if page.profile.more_info %}
diff --git a/_layouts/bib.liquid b/_layouts/bib.liquid
index 6f50f562b4d4..5f6218e35948 100644
--- a/_layouts/bib.liquid
+++ b/_layouts/bib.liquid
@@ -10,6 +10,7 @@
{% assign entry_path = entry.preview | prepend: '/assets/img/publication_preview/' %}
{%
include figure.liquid
+ loading="eager"
path=entry_path
sizes = "200px"
class="preview z-depth-1 rounded"
@@ -251,8 +252,15 @@
>
{% endif %}
{% if site.enable_publication_badges.google_scholar and entry_has_google_scholar_badge %}
-
-
+
+
{% endif %}
diff --git a/_layouts/profiles.liquid b/_layouts/profiles.liquid
index e16ac2974d9d..fc9496a59ca1 100644
--- a/_layouts/profiles.liquid
+++ b/_layouts/profiles.liquid
@@ -15,7 +15,7 @@ layout: page
{% assign profile_image_class = 'img-fluid z-depth-1 rounded' %}
{% endif %}
{% capture sizes %}(min-width: {{site.max_width}}) {{ site.max_width | minus: 30 | times: 0.3}}px, (min-width: 576px) 30vw, 95vw"{% endcapture %}
- {% include figure.liquid path = profile_image_path class = profile_image_class sizes = sizes alt = profile.image %}
+ {% include figure.liquid loading="eager" path=profile_image_path class=profile_image_class sizes=sizes alt=profile.image %}
{% endif %}
{% if profile.more_info %}
diff --git a/_posts/2015-05-15-images.md b/_posts/2015-05-15-images.md
index 1b407a4d8a1e..61f687f8b806 100644
--- a/_posts/2015-05-15-images.md
+++ b/_posts/2015-05-15-images.md
@@ -12,10 +12,10 @@ This is an example post with image galleries.
- {% include figure.liquid path="assets/img/9.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/9.jpg" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/7.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/7.jpg" class="img-fluid rounded z-depth-1" %}
@@ -27,10 +27,10 @@ Simply add `data-zoomable` to `
` tags that you want to make zoomable.
- {% include figure.liquid path="assets/img/8.jpg" class="img-fluid rounded z-depth-1" zoomable=true %}
+ {% include figure.liquid loading="eager" path="assets/img/8.jpg" class="img-fluid rounded z-depth-1" zoomable=true %}
- {% include figure.liquid path="assets/img/10.jpg" class="img-fluid rounded z-depth-1" zoomable=true %}
+ {% include figure.liquid loading="eager" path="assets/img/10.jpg" class="img-fluid rounded z-depth-1" zoomable=true %}
diff --git a/_posts/2024-01-27-advanced-images.md b/_posts/2024-01-27-advanced-images.md
index eb9beeee017b..3baa160bb07c 100644
--- a/_posts/2024-01-27-advanced-images.md
+++ b/_posts/2024-01-27-advanced-images.md
@@ -18,11 +18,11 @@ This is an example post with advanced image components.
This is a simple image slider. It uses the [Swiper](https://swiperjs.com/) library. Check the [examples page](https://swiperjs.com/demos) for more information of what you can achieve with it.
- {% include figure.liquid path="assets/img/9.jpg" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/7.jpg" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/8.jpg" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/10.jpg" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/12.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/9.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/7.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/8.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/10.jpg" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/12.jpg" class="img-fluid rounded z-depth-1" %}
## Image Comparison Slider
diff --git a/_projects/1_project.md b/_projects/1_project.md
index b15faa839551..11c41af664fd 100644
--- a/_projects/1_project.md
+++ b/_projects/1_project.md
@@ -23,13 +23,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -37,7 +37,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
diff --git a/_projects/2_project.md b/_projects/2_project.md
index a8ec94418fea..25de228cf2a7 100644
--- a/_projects/2_project.md
+++ b/_projects/2_project.md
@@ -23,13 +23,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -37,7 +37,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
diff --git a/_projects/3_project.md b/_projects/3_project.md
index cf2de71789f2..ae4eecf4ea02 100644
--- a/_projects/3_project.md
+++ b/_projects/3_project.md
@@ -23,13 +23,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -37,7 +37,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
diff --git a/_projects/4_project.md b/_projects/4_project.md
index 453543079aa8..1144b9c837d6 100644
--- a/_projects/4_project.md
+++ b/_projects/4_project.md
@@ -22,13 +22,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -36,7 +36,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
diff --git a/_projects/5_project.md b/_projects/5_project.md
index 05be799a35a9..35c8e6381d57 100644
--- a/_projects/5_project.md
+++ b/_projects/5_project.md
@@ -22,13 +22,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -36,7 +36,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
diff --git a/_projects/6_project.md b/_projects/6_project.md
index 1c9f23d7b3b6..36ea874c8011 100644
--- a/_projects/6_project.md
+++ b/_projects/6_project.md
@@ -22,13 +22,13 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/1.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/3.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
@@ -36,7 +36,7 @@ To give your project a background in the portfolio page, just add the img tag to
- {% include figure.liquid path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}
+ {% include figure.liquid loading="eager" path="assets/img/5.jpg" title="example image" class="img-fluid rounded z-depth-1" %}