Best way to link to a page relative the site's baseurl

support
8

That is asciidoctor, using the ref built-in shortcode to find a single page in content based on its name. Won’t work for anything else. Syntax for Markdown is different, of course. Trying to find a file in an arbitrary directory based on the website base URL is gnarly.

I did use a shortcode to refer to images in the /static/images site directory, which is not standard. Hugo has the concept of “page bundles” that I can refer to without specifying a path. Nice if you have images that only belong to the content of a particular page or lowest-level branch, but what if you use an image in multiple places?

My shortcode is image.html (listed in the following snippet). Add attributes as needed. If you want, you can put in a <figcaption> tag with <figcaption>{{ .Inner }}</figcaption> at the desired location. I based this shortcode on the built-in {{< figure >}} shortcode described in the Hugo documentation in the topic
Use Hugo’s Built-in Shortcodes in the section figure:

<figure>
    <img src="{{ .Site.BaseURL }}{{ .Site.Params.imageDir }}/{{ .Get "filename" }}"
{{ with .Get "alt"}}
    alt="{{.}}"
{{ end }}
{{ with .Get "width"}}
    width="{{.}}"
{{ end }}
{{ with .Get "height"}}
        height="{{.}}"
{{ end }}/>
</figure>