[Bug] Images don't show on post listing

[AlexHedley]

Created a post - /input/posts/images.md
Added an image /input/posts/images/background.jpg

![background](images/background.jpg "background")

When deployed if you look at the listing, the html is

<img src="images/background.jpg" alt="background" title="background">

• https://alex-hedley.github.io/statiqweb-example/page/2

but fine on the specific post page.

Links

• https://github.com/alex-hedley/statiqweb-example/blob/main/src/input/posts/images/background.jpg
• https://github.com/alex-hedley/statiqweb-example/blob/main/src/input/posts/images.md
• https://raw.githubusercontent.com/alex-hedley/statiqweb-example/main/src/input/posts/images.md

[daveaglick]

Good one, and also going to be pretty tricky. The issue is that the listing page grabs the blurb HTML straight from what's been rendered in the post (I think it's the first paragraph element by default). Since the image link is relative, and the post is under a subfolder that the listing isn't, the copied HTML from the post isn't referring to the correct location because the base path for the relative image link is different.

One quick workaround would be to root the image path so it's coming from the root of the site (including any top-level subfolders, I.e. LinkRoot).

I'll think about a better longer-term fix. Ideally I'd be able to specify an alternate base path for relative links just for the listing section of the post listing page, but I think alternate base paths ate only for an entire page (will need to research this). Alternatively I might be able to parse the HTML for the blurbs and rewrite any relative links, but that gets a little tricky and might break other stuff.

[daveaglick]

I'm also wondering if this would be best handled by some JavaScript in the theme on the post list page. I generally don't love JS for stuff like this and prefer to keep it to a minimum, but it might make sense to just clean these relative links up on the client if there any.