The file-based CMS Kirby became an inte­gral part of my tool belt for devel­op­ing web­sites with dynamic con­tent. One of its strengths is the focus on sim­plic­ity and exten­si­bil­ity. With lit­er­ally every project I come to a point where you are in need of some spe­cific extra func­tion­al­ity — that’s how Kirby is designed to work. In a lot of cases there is already some­thing out there pro­vided by Kirby’s great com­mu­nity¹ but often I need either some­thing com­pletely new or my use­case is a bit spe­cific. In the latter case obvi­ously I have to build a solu­tion myself and just recently I’ve made it a habit to go the extra mile and bundle them up to self-con­tained, highly con­fig­urable plu­g­ins. I open-source them on GitHub and col­lect a list below.²

1

Kirby Light­box-Gallery 🖼

This plugin allows the con­tent-editor to insert beau­ti­fully aligned gal­leries with a one-liner. It comes with light­box-sup­port via Pho­to­Swipe out of the box and has a lot of options to play with.

Get it on GitHub | Demo

2

HTML5-Video Kir­by­tag 📹

Videos-embeds in HTML get­ting right is hard. I tried my best to max out the actual- and per­ceived per­for­mance by load­ing them lazily, dis­play­ing col­ored place­hold­ers, auto­mat­i­cally detect­ing avail­able video-sources and pro­vid­ing image-fall­backs.

This plugin also enables GIF-like styled videos³ so you can ben­e­fit from lower file­sizes and the amaz­ing qual­ity of videos. Actu­ally even the »GIF« you see below is a video embed­ded with this plugin — just open your Dev-Tools. 🤓

Get it on GitHub | Demo

3

Kirby Anchor-Head­ings ⚓

An impor­tant part of the web are hyper­links, they are even more prac­ti­cal when they can point directly to spe­cific para­graphs. This plugin auto­mat­i­cally gen­er­ates iden­ti­fiers for each head­ing and inserts anchors right in front of them. I’ve also writ­ten an advanced-guide about which markup and styling needs to be applied for cre­at­ing the nice anchor hover-effect like you can see on this page. 

Get it on GitHub | Demo