Image files paths with spaces are not parsed correctly

[roboticforest]

I have an example file named "circle bridge on lake.jpeg" (note the spaces) and am trying to load it in a markdown file with:

![circle bridge on lake](%config.gallery_art_url%/circle bridge on lake.jpeg)
*circle bridge on lake*

Instead of generating the following expected HTML:

<div><p><img src="http://localhost/assets/gallery-art/circle bridge on lake.jpeg" alt="circle bridge on lake" />
<em>circle bridge on lake</em></p></div>

Pico generates the following broken half-parsed HTML:

<div><p>![circle bridge on lake](<a href="http://localhost/assets/gallery-art/circle">http://localhost/assets/gallery-art/circle</a> bridge on lake.jpeg)
<em>circle bridge on lake</em></p></div>

I understand that usually people don't have spaces in their file names on the web, but this is all being generated via bash scripts and the file names are the image descriptions, so I would prefer to keep the spaces.

[PhrozenByte]

Unfortunately Markdown requires URLs not to contain any spaces, and so does Parsedown, the Markdown parser Pico uses. The easiest solution is to rename all files using another bash script.

If your gallery is at a known place in your website, you can make things easier for you by adding a YAML structure to your page's YAML header and interpret it in your Twig templates accordingly:

---
title: My page
gallery:
  - img: %config.gallery_art_url%/circle_bridge_on_lake.jpeg
    description: circle bridge on lake
  - img: %config.gallery_art_url%/another_image.jpeg
    description: a different description
---

Some **Markdown** contents

{% for item in meta.gallery %}
    <div><p><img src="{{ item.img|url }}" alt="{{ item.description }}" />
    <em>{{ item.description }}</em></p></div>
{% endfor %}

[roboticforest]

Thank you for such a fast and thorough response!

I was afraid there wouldn't be a way to keep the spaces. I'll have to look into adjusting the bash scripts that are generating the markdown files and headers. :thinking: Hm... Maybe they could strip out underscores/dashes so that descriptions look right? I've never done that kind of string manipulation in bash before. I'm assuming it's possible.

For the curious: My gallery artwork is in a known place, but there may or may not be multiple gallery pages in different locations. The bash scripts I have look through the gallery art directory and for each image generate a like-named single image display page markdown file complete with header, image link, and placeholders for user content. The gallery template then can display the excerpt from these pages.

If I can get the bash scripts adjusted properly to work around not having spaces in the file names they'll generate the following:

---
title: Circle Bridge On Lake
description: Artwork
excerpt: |
    ![Circle Bridge On Lake](%config.gallery_art_url%/circle-bridge-on-lake.jpeg)
    *Circle Bridge On Lake*
---

![Circle Bridge On Lake](%config.gallery_art_url%/circle-bridge-on-lake.jpeg)

Write a description here.

[roboticforest]

I have my bash scripts updated and all of the files no longer have any spaces in their names. Thank you again for the help @PhrozenByte .