From 7b010a6baeaabcfec70c51fb6fe1336fe5611940 Mon Sep 17 00:00:00 2001 From: David Martin Date: Mon, 11 Nov 2024 14:30:58 +0000 Subject: [PATCH 1/3] Add link around blog images Signed-off-by: David Martin --- .eleventy.js | 2 ++ README.md | 7 ++++++- eleventy.config.images.js | 4 +++- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/.eleventy.js b/.eleventy.js index 036d48b..476e74d 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -16,6 +16,8 @@ module.exports = function(eleventyConfig) { eleventyConfig.addPassthroughCopy("src/.well-known"); + eleventyConfig.addPassthroughCopy("src/blog/**/*.png"); + let markdownItOptions = { html: true, breaks: true, diff --git a/README.md b/README.md index 8ed019d..3607684 100644 --- a/README.md +++ b/README.md @@ -36,11 +36,16 @@ This will ensure the blog post title shows up in the post list, grouped by year The title, author and date will also render in a styled manner at the top of the post page. If you want to include images, you can create a folder in the `src/blog/` folder, and put the markdown file there, along with any images. -Then you can insert an image like this: +Make sure the folder name is the same as the markdown file name so that the url allows relative image links to work. For example, if the folder is `src/blog/mypost/` and the markdown file is `mypost.md`, then the url will be `/blog/mypost/`. If they are different, like `src/blog/mypost/MyPost.md`, the url will be `/blog/mypost/MyPost/` and relative image links will give a 404. + +To insert an image, use the image helper function: ```njk {% image "./myimage.png", "My image" %} ``` +Images will sized automatically for the site, but also include a link to the original size. +This can be helpful if sufficient detail is not visible in a shrunk down image. + The post list template is at `src/_includes/postslist.njk`. The post page template is at `src/_includes/layouts/post.njk`. diff --git a/eleventy.config.images.js b/eleventy.config.images.js index 7f632db..b140e4d 100644 --- a/eleventy.config.images.js +++ b/eleventy.config.images.js @@ -46,6 +46,8 @@ module.exports = function(eleventyConfig) { decoding: "async", }; - return eleventyImage.generateHTML(metadata, imageAttributes); + let imageHtml = eleventyImage.generateHTML(metadata, imageAttributes); + + return `${imageHtml}`; }); }; From aa5b17ad4e832af3868a6753506445a6726eb894 Mon Sep 17 00:00:00 2001 From: David Martin Date: Mon, 11 Nov 2024 14:31:24 +0000 Subject: [PATCH 2/3] Rename file to temp.md Signed-off-by: David Martin --- .../{understanding-cyclomatic-complexity.md => temp.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/blog/Understanding-Cyclomatic-Complexity/{understanding-cyclomatic-complexity.md => temp.md} (100%) diff --git a/src/blog/Understanding-Cyclomatic-Complexity/understanding-cyclomatic-complexity.md b/src/blog/Understanding-Cyclomatic-Complexity/temp.md similarity index 100% rename from src/blog/Understanding-Cyclomatic-Complexity/understanding-cyclomatic-complexity.md rename to src/blog/Understanding-Cyclomatic-Complexity/temp.md From deb39c4571865269bb59507b2a0924cd423bfad6 Mon Sep 17 00:00:00 2001 From: David Martin Date: Mon, 11 Nov 2024 14:31:32 +0000 Subject: [PATCH 3/3] Rename temp.md to Understanding-Cyclomatic-Complexity.md Signed-off-by: David Martin --- .../{temp.md => Understanding-Cyclomatic-Complexity.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/blog/Understanding-Cyclomatic-Complexity/{temp.md => Understanding-Cyclomatic-Complexity.md} (100%) diff --git a/src/blog/Understanding-Cyclomatic-Complexity/temp.md b/src/blog/Understanding-Cyclomatic-Complexity/Understanding-Cyclomatic-Complexity.md similarity index 100% rename from src/blog/Understanding-Cyclomatic-Complexity/temp.md rename to src/blog/Understanding-Cyclomatic-Complexity/Understanding-Cyclomatic-Complexity.md