diff --git a/config/_default/config.toml b/config/_default/config.toml
index df71fa9..75d4703 100644
--- a/config/_default/config.toml
+++ b/config/_default/config.toml
@@ -78,6 +78,9 @@ rel = "sitemap"
[[module.mounts]]
source = "static"
target = "static"
+ [[module.mounts]]
+ source = "layouts"
+ target = "layouts"
[[module.mounts]]
source = "node_modules/flexsearch"
target = "assets/js/vendor/flexsearch"
@@ -87,3 +90,6 @@ rel = "sitemap"
[[module.mounts]]
source = "node_modules/mermaid"
target = "assets/js/vendor/mermaid"
+ [[module.mounts]]
+ source = "node_modules/@hyas/images/layouts"
+ target = "layouts"
diff --git a/config/_default/params.toml b/config/_default/params.toml
index 5780d96..2ade217 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -46,12 +46,19 @@ siteLinksSearchBox = false
themeColor = "#fff"
# Images
-quality = 85
-bgColor = "#fff"
-landscapePhotoWidths = [900, 800, 700, 600, 500]
-portraitPhotoWidths = [800, 700, 600, 500]
-lqipWidth = "20x"
-smallLimit = "300"
+# quality = 85
+# bgColor = "#fff"
+# landscapePhotoWidths = [900, 800, 700, 600, 500]
+# portraitPhotoWidths = [800, 700, 600, 500]
+# lqipWidth = "20x"
+# smallLimit = "300"
+
+# Images
+imageResponsive = true
+imageConvertTo = "webp"
+imageImageSizes = ["480","720","1080","1280","1600","2048"]
+singleSize = false
+imageAddClass = "img-fluid lazyload blur-up"
# Footer
footer = "Powered by Netlify, Hugo, and Doks"
diff --git a/content/en/blog/say-hello-to-doks/image003.png b/content/en/blog/say-hello-to-doks/image003.png
new file mode 100644
index 0000000..80e5c5d
Binary files /dev/null and b/content/en/blog/say-hello-to-doks/image003.png differ
diff --git a/content/en/blog/say-hello-to-doks/index.md b/content/en/blog/say-hello-to-doks/index.md
index e9c3185..2c626ec 100644
--- a/content/en/blog/say-hello-to-doks/index.md
+++ b/content/en/blog/say-hello-to-doks/index.md
@@ -9,3 +9,7 @@ weight: 50
images: ["say-hello-to-doks.png"]
contributors: ["Henk Verlinde"]
---
+
+![Image](security-as-code-startup-jit-comes-out-of-stealth-with-38-5m-in-seed-funding.jpg)
+
+![Screenshot](image003.png)
diff --git a/content/en/blog/say-hello-to-doks/security-as-code-startup-jit-comes-out-of-stealth-with-38-5m-in-seed-funding.jpg b/content/en/blog/say-hello-to-doks/security-as-code-startup-jit-comes-out-of-stealth-with-38-5m-in-seed-funding.jpg
new file mode 100644
index 0000000..9c6204c
Binary files /dev/null and b/content/en/blog/say-hello-to-doks/security-as-code-startup-jit-comes-out-of-stealth-with-38-5m-in-seed-funding.jpg differ
diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
deleted file mode 100644
index 4a44740..0000000
--- a/layouts/_default/_markup/render-image.html
+++ /dev/null
@@ -1,36 +0,0 @@
-{{ $image := "" -}}
-{{ if (urls.Parse .Destination).IsAbs }}
- {{ $image = resources.GetRemote .Destination -}}
-{{ else -}}
- {{ $image = .Page.Resources.GetMatch .Destination -}}
-{{ end -}}
-{{ with $image -}}
- {{ $lqip := $image.Resize site.Params.lqipWidth -}}
-
- {{ $imgSrc := "" -}}
- {{ $imgSrcSet := slice -}}
-
- {{ $widths := site.Params.landscapePhotoWidths -}}
- {{ if gt $image.Height $image.Width -}}
- {{ $widths = site.Params.portraitPhotoWidths -}}
- {{ end -}}
-
- {{ range $widths -}}
- {{ $srcUrl := (printf "%dx" . | $image.Resize).Permalink -}}
- {{ if eq $imgSrc "" -}}{{ $imgSrc = $srcUrl -}}{{ end -}}
- {{ $imgSrcSet = $imgSrcSet | append (printf "%s %dw" $srcUrl .) -}}
- {{ end -}}
- {{ $imgSrcSet = (delimit $imgSrcSet ",") -}}
-
- {{ if gt $image.Width site.Params.smallLimit -}}
-
- {{ else -}}
-
- {{ end -}}
-{{ else -}}
- {{ erroridf "image-not-found" "Image not found" -}}
-{{ end -}}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index e60812b..71ff6ee 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,6 +14,7 @@
"@babel/core": "^7.18",
"@babel/preset-env": "^7.18",
"@fullhuman/postcss-purgecss": "^4.1",
+ "@hyas/images": "^0.2.0",
"auto-changelog": "^2.4",
"autoprefixer": "^10.4",
"bootstrap": "^5.1",
@@ -1750,6 +1751,12 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true
},
+ "node_modules/@hyas/images": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/@hyas/images/-/images-0.2.0.tgz",
+ "integrity": "sha512-MWX6VoL6mOhbnXgt2pSsISYS87x1ZfQV+cFQ0ozvEZ944OJdeEph4vNyGpZAioFchTzEaZ3tK2gnRj1MOgaerQ==",
+ "dev": true
+ },
"node_modules/@jridgewell/gen-mapping": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@@ -8155,6 +8162,12 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true
},
+ "@hyas/images": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/@hyas/images/-/images-0.2.0.tgz",
+ "integrity": "sha512-MWX6VoL6mOhbnXgt2pSsISYS87x1ZfQV+cFQ0ozvEZ944OJdeEph4vNyGpZAioFchTzEaZ3tK2gnRj1MOgaerQ==",
+ "dev": true
+ },
"@jridgewell/gen-mapping": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
diff --git a/package.json b/package.json
index 25d73dd..41a06bb 100644
--- a/package.json
+++ b/package.json
@@ -42,6 +42,7 @@
"@babel/core": "^7.18",
"@babel/preset-env": "^7.18",
"@fullhuman/postcss-purgecss": "^4.1",
+ "@hyas/images": "^0.2.0",
"auto-changelog": "^2.4",
"autoprefixer": "^10.4",
"bootstrap": "^5.1",