Recommendations for image gallery options so I can show a caption under every image?

I’m trying to create an image gallery as a portfolio of work i’ve done, so i’m hoping to be able to add a caption to every image, but that’s not possible in Ghost. I’ve seen other posts about this limitation, but i’ve not found anything telling of a workaround or some other host/provider I could use and then embed a gallery instead.

Any ideas?

Here’s one approach.

  1. Create a HTML card and enter:
<div class="kg-width-wide" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px;">

This creates a grid with CSS.
2. Then, add images in the editor as you normally would.
3. After the images, add another HTML card with:

</div>

This closes up the grid you created earlier.

Two things:

  • This will work best with images that have similar aspect ratios.
  • This will also work with other cards, not just images, so you could potentially make a grid of Product cards, for example
4 Likes

This works perfectly! Thanks so much Ryan.

1 Like