I am using the ananke theme. After troubleshooting some other issues, I found out that my relURL and absURL are returning the entire path to my project, such as /path/to/hugo/project/content/posts/test.md rather than /content/posts/test.md. In the case of absURL it looks like this: https://example.com/path/to/hugo/project/content/posts/test.md
I am assuming I made a mistake when installing, or skipped a configuration step? I searched, but could not seem to find anyone that has had the same problem.
Here is the output of hugo env:
hugo v0.145.0-666444f0a52132f9fec9f71cf25b441cc6a4f355+extended linux/amd64 BuildDate=2025-02-26T15:41:25Z VendorInfo=gohugoio
GOOS="linux"
GOARCH="amd64"
GOVERSION="go1.24.0"
github.com/sass/libsass="3.6.6"
github.com/webmproject/libwebp="v1.3.2"
WHO is creating the wrong link? a shortcode? a render hook? a layout file?
is it a general problem (all links) or localized (just a specific spot)?
content of the layout file that is creating the absURL
I think “someone” is doing “something” between absURL and the layout file where you create the link or URL. It might be a shortcode or a render hook. I wonder what you might have troubleshoot before you ran into that issue, because without changes to the code it should not happen with Ananke.
Thank you for the reply - yes, I agree, I am thinking I probably broke something somewhere. I found the issue when I was troubleshooting placing @font-face in my custom.css and was not getting it to work. I then noticed that Chrome dev tools was saying that main.css was located in /path/to/my/hugo/project/ananke/css/main.css. So I looked at partial site-style.html and noticed relURL was being called, so I printed that to see that it was returning my project’s path. I am using the included, unedited site-style.html from ananke:
{{ with partialCached "func/style/GetMainCSS.html" "style/GetMainCSS" }}
<link rel="stylesheet" href="{{ .RelPermalink }}" >
{{ end }}
{{ range site.Params.custom_css }}
{{ with partialCached "func/style/GetResource.html" . . }}{{ else }}
<link rel="stylesheet" href="{{ relURL . }}">
{{ end }}
{{ end }}
For testing I have tried printing absURL from different places including within partials and in baseof.html, all with the same results.
As far as I can tell, ananke does not use relURL or absURL anywhere else, so all the other links look OK. I am using some edited partials - but not sure that I could redefine absURL or relURL there?
baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'ananke'
[params]
custom_css = ['custom.css']
and the file in site_root/assets/ananke/css/custom.css
and it works
check the filename incl. letter case!
tl;tr;
I used the quickstart with the most recent commit of ananke (git clone). This has a slightly different site-style.html <link rel="stylesheet" href="{{ urls.RelURL (.) }}"> but that is irrelevant, maybe some other changes in the called partial.
you can’t redefine that template functions. But anyhow the line is not executed if the file is at the correct place in assets.
if it’s not there the docs state that the filename will be relative to the sites root. So placing them in static will help.
Note on retrocompatibiliy for custom css : If the files registered through the custom_css setting are not found in assets/ananke/css the theme will expect them to live at the given path relative to the static directory and load them as <link> requests.
If you cannot find it, maybe you can share your repo - will speed things up
@irkode thank you for your reply. I believe I have custom.css in the right place in assets/ananke/css/custom.css. My styles are working (except @font-face).
Regardless, I would not expect for relURL or absURL to expose my system’s file structure, based on the documenation?
tracked that down a little bit:
there’s a partial layouts\partials\comentario.html
and for test purposes the op outputs <div>{{ relURL . }}</div>
which prints the full path to the filename.
it’s used fe in http://localhost:1313/posts/test/
imho the main problem here is, that the Ananke partial site-style is operating on strings whereas the OPs partial is called with a context PAGE.
So he’s actually calling relURL PAGE-object that results in the full path. which in any case didn’t work before.
Dunno if the conversion is done by relURL or when evaluating the argument but a %s on the page object returns the full Path (equal to .Page.File.Filename)
looks like the automatic conversion of DOT to string has changed. (remembering there was something with changes of pages backed by a file ?)
Thank you, this explanation makes sense and helps me understand its behavior a bit. But some notes:
(I don’t really plan to use relURL or absURL in pages, outside of testing). When I inspect the code with Chrome I still see the following in the Sources tab: /path/to/project/hugo/ananke/css/main.css. See screenshot:
comentario.css is actually being called by a third-party commenting module and not by Ananke, so it has been working.
Yes, I need to figure out relative path for @font-face, but the current relative path seems to be relative to system root rather than project root, based on screenshots above?
That’s because of the generated public\ananke\css\main.css.map
mmh, if it’s statically loaded otherwise, why do you have it in custom_css. That setting does not work
no idea, but if you cannot get that to work, there are some topic here, maybe a fresh topic regardiung the font include would be good. to get this one closed with the initial relURL thing.
OK, I see. Yes I can close this topic and create a new one. I was assuming that the relative path needed in my css was related to the relative path generated by relURL, but I now see that it is not.
I will open a topic on the Ananke theme site, since the main.css.map is being generated by the theme. And I suspect that my @font-face problem is related to the relative url generated by main.css.map.
Thank you for you explanations.
Edit: I figured out how to disable SourceMap to hide system path, nothing to do with my font issue. Still have a lot to learn…