fuwari icon indicating copy to clipboard operation
fuwari copied to clipboard

feat: add image-caption feature

Open Hasenpfote opened this issue 9 months ago • 12 comments

This PR provides a feature to add captions to images. Only CommonMark syntax is supported, so there is no learning cost.

Demo and details are here.

Hasenpfote avatar Mar 21 '25 15:03 Hasenpfote

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
fuwari-yags ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 5, 2025 3:20pm

vercel[bot] avatar Mar 21 '25 15:03 vercel[bot]

My PC's OS is Windows, so the EOL of the file is CRLF by default. Multiple images doesn't work in the following case.

![Image 1 description](url "Image Title 1")  
![Image 2 description](url "Image Title 2")

ikamusume7 avatar Mar 23 '25 12:03 ikamusume7

@ikamusume7 Thanks for reporting! I've fixed it.

Hasenpfote avatar Mar 23 '25 15:03 Hasenpfote

lovely update !! thank you for your work 🙏

autumnesponda avatar Mar 23 '25 19:03 autumnesponda

one thing to note is this breaks images using relative sources, i.e. ![description](./image01.jpg "An image with a relative location to the markup")

autumnesponda avatar Mar 24 '25 16:03 autumnesponda

@autumnesponda

When referencing local files in a Markdown file, they must be placed under the public/ directory. For example, a file located at public/images/img.png should be referenced like this.

![foo](/images/img.png "title")

This restriction also applies to standard image syntax, not just this plugin.

https://docs.astro.build/en/guides/images/

Hasenpfote avatar Mar 25 '25 01:03 Hasenpfote

When referencing local files in a Markdown file, they must be placed under the public/ directory. For example, a file located at public/images/img.png should be referenced like this.

This restriction also applies to standard image syntax, not just this plugin.

Just wanted to make note of potentially breaking changes in case this ends up getting merged to master. I have moved my photos to the public directory since I pulled in these changes to my site and think it's worthwhile but on master relative images get resolved fine. see https://docs.astro.build/en/guides/images/#images-in-markdown-files

not suggesting you need to change anything! just wanted to note it

autumnesponda avatar Mar 25 '25 15:03 autumnesponda

@autumnesponda

I initially misunderstood, but I now fully understand the situation. To prevent breaking changes, I will first apply a temporary workaround and then explore a fundamental solution.

Hasenpfote avatar Mar 26 '25 01:03 Hasenpfote

Seems that it doesn't worked with local image? content:

![Description](./directory.png "Directory Structure")

![Description](https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/208fc754-890d-4adb-9753-2c963332675d/width=640/01651-1456859105-(colour_1.5),girl,_Blue,yellow,green,cyan,purple,red,pink,_best,8k,UHD,masterpiece,male%20focus,%201boy,gloves,%20ponytail,%20long%20hair,.jpeg "Directory Structure")

Result: CleanShot 2025-03-30 at 17 30 41@2x

Kayxue avatar Mar 30 '25 09:03 Kayxue

Astro applies complex processing when optimizing images in the src folder. Currently, the plugin lacks sufficient information to control this behavior effectively. To prevent unintended breaking changes, images in the src folder are explicitly excluded from processing. However, images in the public folder work without any issues.

Hasenpfote avatar Mar 30 '25 10:03 Hasenpfote

Relative paths under src/ are now supported.

Hasenpfote avatar Apr 05 '25 14:04 Hasenpfote

thats really nice.. great demo as well

luxus avatar Apr 07 '25 23:04 luxus