Helpers

Helpers that facilitate the composing of posts for both Org Mode and Markdown.

Click here to view the contents supported or customized for Markdown.

Gallery

You can create a gallery as usual in Minimal Mistakes. With this plugin you have these extra features:

Add a columns parameter to each gallery to control the columns of a gallery such as:

{% include gallery columns=6 %}

The image size should be adjusted automatically.

Support adding images to a gallery by only using the image_path parameter or the URL in the front matter such as:
```
gallery:
  - image_path: /assets/archive/image/foo/unsplash-gallery-image-1.jpg
  - /assets/archive/image/foo/unsplash-gallery-image-1.jpg
  - /assets/archive/image/foo/unsplash-gallery-image-1.jpg
```
A gallery originally requires both url and image_path in order to have a pop-up view of the images. This plugin just makes it more convenient to add images to a gallery. But you can still stick to the old method.
Support link abbreviations in image paths. See this designated section for more details.
Use alt for title if title is unspecified so you don’t need to write the same content for two parameters.
Support Liquid links in title, e.g.,

---
gallery:
  - image_path: https://i.postimg.cc/Vv8jFw8D/unsplash-gallery-image-1.jpg
    title: "Prompt: [Local images]({{ site.baseurl }}{% post_url 2026-02-19-local-images %})"
---

All these customizations are backward-compatible, that is, you can still write a gallery in the original way to get the original feel.

Here’s a gallery demo utilizing the above features:

---
link_abbrs:
  - link_abbr: foo https://i.postimg.cc/Vv8jFw8D/
gallery:
  - image_path: foo:unsplash-gallery-image-1.jpg
    alt: "Use alt for title and a link abbreviation."
  - image_path: foo:unsplash-gallery-image-1.jpg
    title: "Link to post: [Dark Mode]({{ site.baseurl }}/docs/dark-mode/)"
  - foo:https://i.postimg.cc/Vv8jFw8D/unsplash-gallery-image-1.jpg
  - foo:unsplash-gallery-image-1.jpg
---

{% include gallery columns=6 caption="My custom gallery" %}

Use alt for title and a link abbreviation. — My custom gallery

Link Abbreviations

You can use link abbreviations in a document drafted in Markdown or Org Mode, for example, foo:my-image.jpg where foo: is a link abbreviation of the full path of the parent of my-image.jpg.

This lets you focus on resource names instead of their full paths when composing links, and switch their parent path easily when many resources are under the same parent.

To create a link abbreviation, in the front matter add the abbreviation and its full form in a link_abbr in the link_abbrs array, like this:

link_abbrs:
  - link_abbr: foo https://i.postimg.cc/Vv8jFw8D/

Then you can use the abbreviation in links throughout the document. It will be expanded to the full form in the built site.

Org Mode has its own built-in link abbreviations using #+LINK. Here it can also be used for Jekyll build. It acts as a fallback to link_abbrs in the front matter, i.e., if an abbreviation isn’t found in link_abbrs but found in #+LINK, also use it to expand links in the built site. #+LINK can appear anywhere in the document except the front matter.

---
link_abbrs:
  - link_abbr: foo https://i.postimg.cc/Vv8jFw8D/
---

#+LINK: foo https://your/fallback/link/

Below are the supported use cases of link abbreviations.

Standard Org Links

Here is an image:

[[foo:unsplash-gallery-image-1.jpg]]

Figure

Links written in Liquid syntax are also supported. For example, here is a figure:

{% include figure image_path="foo:unsplash-gallery-image-1.jpg" popup=true
alt="" caption="A figure" %}

Gallery

You can create a gallery as usual in Minimal Mistakes. The extra benefit is that now you can use link abbreviations in it, like this:

---
link_abbrs:
  - link_abbr: foo https://i.postimg.cc/Vv8jFw8D/
gallery2:
  - url: foo:unsplash-gallery-image-1.jpg
    image_path: foo:unsplash-gallery-image-1.jpg
    title: Check this [[foo:unsplash-gallery-image-1.jpg][image]]
  - image_path: foo:unsplash-gallery-image-1.jpg
  - foo:unsplash-gallery-image-1.jpg
  - image_path: [[foo:unsplash-gallery-image-1.jpg]]
    title: An image referenced through an org link
  - [[foo:unsplash-gallery-image-1.jpg]]
  - [[foo:unsplash-gallery-image-1.jpg]]
---

{% include gallery id="gallery2" columns=6 caption="A gallery using link abbreviations " %}

All the link forms shown above can be expanded correctly to the same image path:

Loading Local Files

When running locally you can load resources on your computer by using symlinks. Why symlinks? Because modern browsers block pages from http(s)://… from loading local files via file://… for security (“cross-origin” / local file access).

Follow the steps to use this feature:

Create a symlink to the target data in the symlinks: array in the front matter:
```
---
symlinks:
  - /assets/archive/image/foo ~/Downloads/temp/archive/image/foo
---
```
This creates the symlink _site/assets/archive/image/foo inside the site root, which points to the path ~/Downloads/temp/archive/image/foo/ on your computer.
Then you can refer to the files inside that path like this:

---
gallery:
  - url: /assets/archive/image/foo/20260218184820.png
    image_path: /assets/archive/image/foo/20260218184820.png
  - url: /assets/archive/image/foo/20260218184820.png
    image_path: /assets/archive/image/foo/20260218184820.png
---

![]({{site.url}}{{site.baseurl}}/assets/archive/image/foo/20260218184820.png)

{% include gallery %}

You can even create a link abbreviation to the symlink. For example, here is a gallery loading local files:

---
symlinks:
  - /assets/archive/image/foo ~/Downloads/temp/archive/image/foo
link_abbrs:
  - link_abbr: foo2 /assets/archive/image/foo/
gallery3:
  - url: foo2:unsplash-gallery-image-1.jpg
    image_path: foo2:unsplash-gallery-image-1.jpg
    title: Here is a [link]({{ site.baseurl }}/docs/dark-mode/) in title.
  - image_path: foo2:unsplash-gallery-image-1.jpg
  - foo2:unsplash-gallery-image-1.jpg
  - image_path: [[foo2:unsplash-gallery-image-1.jpg]]
    title: An image referenced through an org link
  - [[foo2:unsplash-gallery-image-1.jpg]]
  - [[foo2:unsplash-gallery-image-1.jpg]]
---

{% include gallery id="gallery3" columns=6 caption="A gallery using symlinks" %}