rolisz's site

Acrylamid image gallery

Acrylamid by default doesn't have image galleries. As I oc­ca­sion­al­ly like to post the images that I take, especially now that I'm visiting nice places in Zurich and the sur­round­ing area, this is quite annoying, as I don't want to manually create all the links for photos.

In the official docs, there is a suggestion to use Jinja2 inside posts to create a local gallery. While it does save you from writing all the image links yourself, you still have to do this for every post in which you want to insert a gallery.

So I wanted to make something more generic, where I could insert with one line a gallery in my post. Two options came to mind: inserting gallery code in the templates or as a filter.

I tried the template idea first, but it had a small problem: I couldn't control where it was inserted. Because in the template I had a {{ entry.content }}, I could insert the gallery only right at the beginning or at the very end of the post.

The filter way took a while until I managed to make it work (the biggest problem was the caching), but in the end it was a short and simple solution:

from acrylamid.filters import Filter
import os


class Gallery(Filter):

    match = ['gallery', 'photos']
    priority = 80.0

    version = 1

    def transform(self, content, entry, *args):
        new_lines = []

        for line in content.splitlines():
            if line[:9].lower() == "gallery: ":
                for file in os.listdir("static/images/"+ line[9:]):
                    new_lines.append("* ![](/images/"+os.path.join(line[9:],
                                                                  file) +")")

            else:
                new_lines.append(line)
        return "\n".join(new_lines)

This has to go in a gallery.py in the filters folder in the base folder of your Acrylamid site. You have to include it either globally or on a per post basis in the list of filters and then at the point where you want to insert the gallery in your post you write:

gallery: relative/path/to/my/image/folder

This will make the plugin insert a Markdown list of the images in that folder, which will then get compiled by Markdown to an HTML list. One small problem that still exists is the inclusion of alt text for the images. One solution I'm looking to explore is to use a separate file in that folder that would contain the de­scrip­tion of individual pictures. But that's a story for another post.