aboutsummaryrefslogtreecommitdiff
path: root/_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md
diff options
context:
space:
mode:
authorMitja Felicijan <mitja.felicijan@gmail.com>2024-03-10 14:59:14 +0100
committerMitja Felicijan <mitja.felicijan@gmail.com>2024-03-10 14:59:14 +0100
commit1100562e29f6476448b656dbddd4cf22505523f6 (patch)
tree442eec492199104bd49dfd74474ce89ade8fcac9 /_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md
parenta40d80be378e46a6c490e1b99b0d8f4acd968503 (diff)
downloadmitjafelicijan.com-1100562e29f6476448b656dbddd4cf22505523f6.tar.gz
Move back to JBMAFP
Diffstat (limited to '_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md')
-rw-r--r--_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md34
1 files changed, 0 insertions, 34 deletions
diff --git a/_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md b/_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md
deleted file mode 100644
index 8293a4d..0000000
--- a/_posts/notes/2023-11-05-add-lazy-loading-to-jekyll-posts.md
+++ /dev/null
@@ -1,34 +0,0 @@
1---
2title: "Add lazy loading of images in Jekyll posts"
3permalink: /add-lazy-loading-to-jekyll-posts.html
4date: 2023-11-05T09:04:28+02:00
5layout: post
6type: note
7draft: false
8---
9
10Normally you define images with `![]()` in markdown files. But jekyll also
11provides a way to adding custom attributes to tags with `{:attr="value"}`.
12
13If you have lots of posts this command will append `{:loading="lazy"}` to all
14images in all your markdown files.
15
16```md
17![image-title](/path/to/your/image.jpg)
18```
19
20will become
21
22```md
23![image-title](/path/to/your/image.jpg){:loading="lazy"}
24```
25
26Shell line bellow. Go into the folder where your posts are (probably `_posts`).
27
28```sh
29find . -type f -name "*.md" -exec sed -i -E 's/(\!\[.*\]\((.*?)\))$/\1{:loading="lazy"}/' {} \;
30```
31
32Under the hood this adds `loading="lazy"` to HTML `img` nodes.
33
34That is about it.