Special handling of lists of images to render Photo Carousel html

[vadimkantorov]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and discussions and couldn’t find anything (or linked relevant results below)

Problem

I'd like to have a way to special-render simple built-in markdown syntax into a Photo Carousel or Photo Grid html (e.g. Instagram-like) in my Astro-rendered markdown blog-posts:

- ![image figcaption](https://path/to/file1.img)
- ![image figcaption](https://path/to/file2.img)

I also posted at :

• https://github.com/orgs/remarkjs/discussions/1466
  but I'm not sure if this Issues board is more appropriate

How does one go about implementing such a plugin?

Current solutions

N/A

Proposed solutions

New rehype plugin for special-handling syntax like:

- ![image figcaption](https://path/to/file1.img)
- ![image figcaption](https://path/to/file2.img)

or

---
- ![image figcaption](https://path/to/file1.img)
- ![image figcaption](https://path/to/file2.img)
---

[wooorm]

Hi! You can do anything with plugins. I think that compared to other ASTs our ASTs are good. See https://unifiedjs.com/learn/ for more info

[github-actions]

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.

[wooorm]

Crosslinking with https://github.com/orgs/remarkjs/discussions/1466

[vadimkantorov]

You can do anything with plugins.

My (so far) failing attempt at a rehype plugin is at https://stackblitz.com/edit/github-rtzsxqqj?file=astro.config.mjs, for some reason Astro does not apply the plugin :( Appreciating any help!

[vadimkantorov]

It appears that my approach is viable, but hits some Astro problems (or bugs) related to caching making it not apply the plugin in some conditions:

• Custom Rehype plugin for transforming a ul > li > img into a CSS-powered Image Carousel (div > figure) is not applied for some reason withastro/astro#14931 (comment)

Overall, I think it would be a very useful plugin (could implemented as a rehype plugin or better as a remark plugin?)