From 608fe3bbe959042dd1d18ef7ca04256cb8d7ad27 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc=20P=C3=A4pper?= Date: Tue, 19 Mar 2019 17:22:40 +0100 Subject: [PATCH 1/4] Added the possibility to add relative cover images --- README.md | 8 ++++++++ layouts/_default/list.html | 5 +++++ layouts/_default/single.html | 5 +++++ 3 files changed, 18 insertions(+) diff --git a/README.md b/README.md index 1f542d8..26cca35 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,7 @@ This theme is pretty basic and covers all of the essentials. All you have to do - [Code highlighting](#code-highlighting) - [How to start](#how-to-start) - [How to configure](#how-to-configure) +* [How to add a cover image to your posts](#how-to-add-a-cover-image-to-your-posts) - [Add-ons](#add-ons) - [How to run your site](#how-to-run-your-site) - [How to edit the theme](#how-to-edit-the-theme) @@ -123,6 +124,13 @@ to `config.toml` file in your Hugo root directory and change params fields. In c **NOTE:** Please keep in mind that currently main menu doesn't support nesting. +## How to add a cover image to your posts + +Adding a cover image to your post is simple and there are two options: + +* Use `cover: "/path/to/absolute/img.jpg"` in your markdown file meta data to link an absolute image +* Use `relcover: "img.jpg" to link the image relative to the blog post folder + ## Add-ons - **Comments** — for adding comments to your blog posts please take a look at `layouts/partials/comments.html` https://github.com/panr/hugo-theme-terminal/blob/master/layouts/partials/comments.html. diff --git a/layouts/_default/list.html b/layouts/_default/list.html index eda29eb..cc21579 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -26,6 +26,11 @@ {{ end }} + {{ $permalink := .Permalink }} + {{ with .Params.RelCover }} + + {{ end }} + {{ with .Params.Cover }} {{ end }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 5ab166f..0050a8c 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -20,6 +20,11 @@ {{ end }} {{ end }} + + {{ $permalink := .Permalink }} + {{ with .Params.RelCover }} + + {{ end }} {{ with .Params.Cover }} From eefc6368dcd88b2558702b970892223cafca8539 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc=20P=C3=A4pper?= Date: Tue, 19 Mar 2019 17:23:48 +0100 Subject: [PATCH 2/4] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 26cca35..3227429 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ This theme is pretty basic and covers all of the essentials. All you have to do - [Code highlighting](#code-highlighting) - [How to start](#how-to-start) - [How to configure](#how-to-configure) -* [How to add a cover image to your posts](#how-to-add-a-cover-image-to-your-posts) +- [How to add a cover image to your posts](#how-to-add-a-cover-image-to-your-posts) - [Add-ons](#add-ons) - [How to run your site](#how-to-run-your-site) - [How to edit the theme](#how-to-edit-the-theme) From 7bf862d9d35e10ddac58545bbedc50d0aaa37f64 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc=20P=C3=A4pper?= Date: Tue, 19 Mar 2019 17:28:41 +0100 Subject: [PATCH 3/4] Update README.md --- README.md | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 3227429..4210936 100644 --- a/README.md +++ b/README.md @@ -126,10 +126,12 @@ to `config.toml` file in your Hugo root directory and change params fields. In c ## How to add a cover image to your posts -Adding a cover image to your post is simple and there are two options: +Adding a cover image to your post is simple and there are two options when you edit your `index.md` file in `content/posts/blog-entry-xy/index.md`: -* Use `cover: "/path/to/absolute/img.jpg"` in your markdown file meta data to link an absolute image -* Use `relcover: "img.jpg" to link the image relative to the blog post folder +* Use `cover: "/path/to/absolute/img.jpg"` to link an absolute image + * Resulting in `https://www.yourpage.com/path/to/absolute/img.jpg` +* Use `relcover: "img.jpg"` to link the image relative to the blog post folder + * Resulting in `https://www.yourpage.com/posts/blog-entry-xy/img.jpg` ## Add-ons From e9aae285a698b86089a13e328caaa32a771103b7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc=20P=C3=A4pper?= Date: Tue, 19 Mar 2019 17:47:05 +0100 Subject: [PATCH 4/4] Improved code by using UseRelativeCover flag to post rather than having cover and relcover to avoid code duplication --- README.md | 2 +- layouts/_default/list.html | 13 ++++++------- layouts/_default/single.html | 13 ++++++------- 3 files changed, 13 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index 4210936..fb738f0 100644 --- a/README.md +++ b/README.md @@ -130,7 +130,7 @@ Adding a cover image to your post is simple and there are two options when you e * Use `cover: "/path/to/absolute/img.jpg"` to link an absolute image * Resulting in `https://www.yourpage.com/path/to/absolute/img.jpg` -* Use `relcover: "img.jpg"` to link the image relative to the blog post folder +* Use `cover: "img.jpg"` and `useRelativeCover: true` to link the image relative to the blog post folder * Resulting in `https://www.yourpage.com/posts/blog-entry-xy/img.jpg` ## Add-ons diff --git a/layouts/_default/list.html b/layouts/_default/list.html index cc21579..c8dbbe5 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -26,13 +26,12 @@ {{ end }} - {{ $permalink := .Permalink }} - {{ with .Params.RelCover }} - - {{ end }} - - {{ with .Params.Cover }} - + {{ if .Params.Cover }} + {{ if .Params.UseRelativeCover }} + + {{ else }} + + {{ end }} {{ end }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 0050a8c..12bc91d 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -20,14 +20,13 @@ {{ end }} {{ end }} - - {{ $permalink := .Permalink }} - {{ with .Params.RelCover }} - - {{ end }} - {{ with .Params.Cover }} - + {{ if .Params.Cover }} + {{ if .Params.UseRelativeCover }} + + {{ else }} + + {{ end }} {{ end }}