Closed goingforbrooke closed 1 year ago
The trailing slash issue seems to be long running, though it's behaving as expected. There's also a chance that shortcodes are broken or that I'm missing something important about how they work.
I'm testing a version of my site with zola serve
and I'm not getting @ipetkov's slash issue. My post is defined in content/post_title/index.md
, which uses content/post_title/test_image.jpeg
via shortcode the same way that @ipetkov does in his posts.
@ipetkov, are you using zola serve
when you get the trailing slash issue?
Yeah I see the issue with both zola serve
and zola build
. I'm on zola 0.17.2
fwiw
Strange-- I'm on 0.17.2
as well. Would you mind pushing a branch of your site with the issue? Post a link to the code here and I'll see if I can reproduce it locally.
@goingforbrooke sure!
Here's the source which builds this broken version of the site
Here is an example of the broken URLs and this is the corresponding shortcode which generates it
Here is what the non-broken version looks like
Thanks! I haven't run it locally yet, but at first blush, you might be missing a trailing slash in your config.toml
's base_url
.
I'm going off my blog's base_url
, which has a trailing slash. On the other hand, my (Zola) site's base_url
doesn't have a trailing slash (and perhaps it should).
I'll try adding a slash to the end of my site's base_url
and see what happens.
Doesn't seem to help :/
It adds a redundant (through harmless) slash in some places. The broken image urls are slightly less broken, though now they end up pointing to the root of the domain but not nested under the blog content :thinking:
Zole might not like the dates that you're prefixing to your blog post directories.
For example, your blog post ipetkov.github.io.content/blog/2022-05-21-steam-deck-first-impressions
is generated as public/blog/steam-deck-first-impressions
(with the date stripped). For this reasons, the page fails to retrieve blog/2022-05-21-steam-deck-first-impressions/deck.jpg
because the path doesn't exist.
I would suggest that you remove the date prefixes from your blog posts, but figure
shortcodes are working fine with no path to the image at all. For example, case_switch.jpg
. tells me that I'm still missing something about asset colocation. On the other hand, this fix works on my test site, which uses a mix of directory-style and markdown-style posts.
What do you think, @ipetkov?
Zola automatically handles stripping dates from pages (or it's documented as a "feature" at least) because all the other links still work
I did a quick test with the various properties that zola's pages are available in the templates:
path: /blog/steam-deck-first-impressions/
permalink: http://127.0.0.1:1111/blog/steam-deck-first-impressions/
relative_path: blog/2022-05-21-steam-deck-first-impressions/index.md
colocated_path: blog/2022-05-21-steam-deck-first-impressions/
Seems like page.path
gives the actual URL the page will fully be generated at while colocated_path
represents the relative URL of the markdown page before processing. Actually page.permalink
seems to pretty much already have the base URL we want, and appending the image name (assuming the argument doesn't include ../
) makes the images resolve for me!
Thanks for going the extra mile to post output and for trying out different properties!
Sadly, using page.permalink
breaks my site. Where do you see the docs for date stripping in Zola?
✅config.base_url
+page.path
: http://127.0.0.1:1025/blog/steam-deck-first-impressions/deck.jpg
✅page.permalink
: http://127.0.0.1:1025/blog/steam-deck-first-impressions/deck.jpg
❌config.base_url
+page.relative_path
: http://127.0.0.1:1025blog/2022-05-21-steam-deck-first-impressions/index.md
/
to base_url
in Cargo.toml
doesn't help.❌config.base_url
+page.colocated_path
: http://127.0.0.1:1025blog/2022-05-21-steam-deck-first-impressions/deck.jpg
/
to base_url
in Cargo.toml
doesn't help.❌config.base_url
+page.path
: http://127.0.0.1:1111//pages-ssg/jekyll_quickstart.png
❌page.permalink
: http://127.0.0.1:1111/pages-ssg/jekyll_quickstart.png
❌config.base_url
+page.relative_path
: http://127.0.0.1:1111/pages_ssg.md/jekyll_quickstart.png
/
inserted after relative_path
✅config.base_url
+page.colocated_path
: http://127.0.0.1:1111/jekyll_quickstart.png
page.colocated_path
is null
because the .md
file isn't colocatedI'd like to use page.colocated_path
, but it doesn't include the date stripping that your blog needs.
I found the docs on removing dates from slugs. As an aside, why are you defining post dates in the frontmatter of index.md
(date = 2022-05-21
)? It's overriding the dates extracted from the post's subdirectory title (2022-05-21
in 2022-05-21-steam-deck-first-impressions
.
Let's use the resize_image
built-in function for all image
s (and figure
s) because it's a reliable way to get a valid "output URL". It works with the directory-post-style that @ipetkov uses and the *.md
-post-style that I use.
We can preserve the look of existing sites by setting the resize dimensions for fit large enough (5000x5000), that no resizing actually happens. This feels unnecessarily hacky, but it provides a stable fix for both posting styles.
@ipetkov, never mind about the docs reference on date stripping-- I found it.
I looked into the docs a bit more and my interpretation is that page.path
and page.permalink
are "output paths" on the generated site. The "input paths" page.relative_path
and page.colocated_path
are "input paths" before the site is generated. "Input paths" need further processing to be valid. For example, page.relative_path
doesn't strip dates from slugs.
As for @ipetkov's page.permalink
suggestion, it doesn't work for my (*.md
-post-style) site because it assumes the directory-post-style.
We want to use page.colocated_paths
to reference images on the input side because (1) Zola recommends it for shortcodes and (2) it works on *.md
-post-style sites by defaulting to null
when *.md
isn't colocated.
The trouble is getting page.colocated_path
into the HTML's src
. In this PR, I convert it to a string and append it to config.base_url
, but that breaks images in @ipetkov's directory-post-style. The get_url
builtin offers "Get the permalink for the given path," but it also doesn't strip dates.
I don't think that there's a built-in way to strip dates from output paths/URLs. We could manually remove dates in the image
shortcode with an if
, but that would be fragile.
Incorporated changes into (new) PR #46.
Not fully sure how zola's internals interact with this, but as of 733f1c17b939238341a50ce353263e9cc4162fe0 I'll see image urls built like:
https://example.comblog/2022-05-21-title-of-the-post/image.jpg
(yes the domain is malformed due to a missing slash), when in reality the image is available athttps://example.com/blog/title-of-the-post/image.jpg