Support relative paths in markdown images

Adds code from Hugo's built-in render-image hook
and modifies it slightly to support relative image
paths in markdown files.

Previously, we'd have to spell the absolute path
from root of the hugo site or make directories for
each individual post which is what Hugo recommend.
But this was very inefficient. This change allows
us to use editors like Obsidian, VSCode and have
them render the images correctly. It also supports
Hugo's page bundles for rendering images as a
result. Based on the order, I believe page bundles
are given priority so that works out.

i.e, if you have the following tree:

```
content
└── posts
   ├── _index.md
   ├── hello.md
   ├── images
   │  └── test.png
   └── test.png
```

You can now include images in `hello.md` in the
following ways:

```
![](test.png)
![](images/test.png)
![](./test.png)
![](./images/test.png)
```
This commit is contained in:
Sangeeth Sudheer 2024-10-30 23:43:32 +05:30
parent c80f6e2898
commit 9f5b8e8059
No known key found for this signature in database
GPG key ID: F6D06ECE734C57D1

View file

@ -1,5 +1,33 @@
{{/*
To get page resources and relative paths to work. Copied as is from default
hook:
https://github.com/gohugoio/hugo/blob/89bd02/tpl/tplimpl/embedded/templates/_default/_markup/render-image.html
*/}}
{{- $u := urls.Parse .Destination -}}
{{- $url := $u.String -}}
{{- if not $u.IsAbs -}}
{{- $path := strings.TrimPrefix "./" $u.Path -}}
{{- $imgResource := .Page.Scratch.Get "typoNilVariable" -}}
{{/* Check if this is a page bundle or standalone page */}}
{{- if .PageInner.Resources -}}
{{- $imgResource = .PageInner.Resources.Get $path -}}
{{- else if (or .PageInner.Parent .PageInner.Parent.Resources) -}}
{{- $imgResource = .PageInner.Parent.Resources.Get $path -}}
{{- end -}}
{{- $imgResource := or $imgResource (resources.Get $path) -}}
{{- with $imgResource -}}
{{- $url = .RelPermalink -}}
{{- with $u.RawQuery -}}
{{- $url = printf "%s?%s" $url . -}}
{{- end -}}
{{- with $u.Fragment -}}
{{- $url = printf "%s#%s" $url . -}}
{{- end -}}
{{- end -}}
{{- end -}}
{{/* Split URL at # */}}
{{ $url := .Destination | safeURL }}
{{ $url = $url | safeURL }}
{{ $file_name_array := split $url "#" }}
{{/*
@ -18,7 +46,7 @@ and build the img class string as "img-tag1 img-tag2 ..."
<figure class="{{ $classes }}">
<div>
<img loading="lazy" alt="{{ .Text }}" src=" {{ $url }}">
<img loading="lazy" alt="{{ .Text }}" src="{{ $url }}">
</div>
{{ with .Title }}