absURL function strips path when using --baseURL flag

support
1

Problem

The absURL function strips the path when using the –baseURL terminal flag, when not used inside the HTML ‘src’ or ‘href’ attribute.

Use case

While in production for a new website, for the client to see, I simply dump a daily build in a sub-directory of my own website.

Example

The list below, are the settings per file.

  • config.toml
    baseURL = "https://website1.com"
    canonifyurls = true
  • _index.md, with JSON frontmatter
    {"image": "/media/image/news/picture.jpg"}
  • _index.html
    <img src="{{ .Params.image }}" data-src="{{ .Params.image | absURL }}">

Then using the following terminal command:
hugo --baseURL="https://website2.com/example/website1-com"

Result

<img src="https://website2.com/example/website1-com/media/image/news/picture.jpg" data-src="https://website2.com/media/image/news/picture.jpg">

Note the missing path “example/website1-com/” in the “data-src” attribute.

Question

Am I doing something wrong, or is this a bug?

Software details

  • Hugo version
    Hugo Static Site Generator v0.19 linux/amd64 BuildDate: 2017-02-27T13:35:54+01:00
  • OS
    Fedora 25 64-bit
2

I understand this, but only after a really hard thinking:

So:

So, if you remove the leading slash: “media/image/news/picture.jpg”

All should be good.

3

Yes, of course…
Thank you very much for taking the time trying to understand my question and for writing an answer.

The solution is indeed easy:
<img src="{{ .Params.image }}" data-src="{{ slicestr .Params.image 1 | absURL }}">

4

Well, that works, but I would say that fixing it in the source (page front matter) would be better. But up to you.

1 Like
5

That would indeed be a better route to take. Thanks.

6

@36928495

If I may, and only if this is the type of site that’s going to grow large over a long period, I would take bep’s recommendation a step further and remove all path-related info from the content so that the image is related strictly to the content itself and not any specific URL pattern or site architecture. I don’t know how you’re organizing the images overall, but you can use page variables like .Section, or .URL in conjunction with what you’re already doing…

It has the added benefit of less typing in the front matter (i.e. and therefore less room for human error), which speaks well to my laziness tendencies.

This is, of course, just a thought :smile:

1 Like