Coming from Webflow, the guys at Kreatives Unternehmertum were definitely used to a lot of flexibility. But of course the custom-tailored approach of a Kirby website will always show.
Some of the fun interactions on the website:
I hope you like GIFs…
Frontend: Easy on the eyes. Backend: Easy to use.
With over 10 section types to choose from, every single page on the website is modular. Every page has an intro section (which will look differently, depending on wether there’s an image or not) and everything else is like playing LEGO®.
That means the editors can add as many different sections to a project page or any other page. Image gallery? Page carousel? Contact persons? You choose:
Introducing Kirby Modules
I built a plugin that helps with such modular websites: Kirby Modules
The plugin takes care of page blueprints, redirecting the page URLs to anchor links and adding modules containers that separate modules from regular pages.
Behind the scenes: A look at the Kirby Panel
While Kirby 3 comes with a lot of awesome new features, I still appreciate the “just the fields you need” aspect of Kirby the most. And being able to add help texts underneath those fields makes every editor feel at home:
Custom fields and plugins
You actually don’t need a lot of plugins to get started with complex Kirby 3 websites. Nevertheless, here are some plugins I used for this project.
A better markdown editor—must have for every client project
While the core textarea is great, I have yet to meet a client that already knows how to write markdown. That’s when a visual markdown editor comes into play. Luckily there’s already a great plugin with lots of features alongside a more visual approach to markdown.
Custom link field for url/email/page/file buttons
You’ll find a lot of (big) buttons on the website. Leading to all kinds of content. External links, internal links, email links, pdf files, …
To make adding them as easy as possible, I developed a custom link field.
I wanted to integrate the latest 6 instagram posts on this page. That’s easily possible with the great “Kirby 3 Instagram” plugin by Bruno Meilick. So easy to set up!
Page sections for huge amounts of pages
Most of the time it’s enough to use pages sections, but once you reach >200 persons and organizations, you’ll need something like the pagetable plugin by Kirby plugin mastermind Sylvain Jule. This plugin makes it possible to sort and search those pages for more efficient content management.
Custom soft hyphens
Daniel designed those beautifully big headlines. But I don’t like how current browsers are dealing with word-breaks. I also didn’t want to add
­ to every headline, making it hard to read. Luckily it’s just a matter of a few lines to add a KirbyTag hook:
With this hook you can simply add a more readable
(-) to any long word (looking at you, Unternehmertum) and control where it breaks.
Managing broken links after a relaunch
Nico Hoffmann developed a very handy plugin, especially for a website relaunch with a well established Google ranking. You can easily add and edit redirects in a custom panel view.
My thoughts on Kirby 3
Quite some things have changed since Kirby 2. With new tools like custom pages or files sections it’s now even easier to build complex websites. There’s still a great community behind this tool and I’m baffled by the number of quality plugins already available.
While building this website, Kirby 3 already got 5 new releases and added features that were greatly appreciated not only for this project. The conditional fields (introduced in 3.1.0) came just in time to make editing pages and sections even easier.
It’s a bit of work to convert your developer head from Kirby 2 to Kirby 3, but it’s definitely worth it.
Do you have any questions about Kirby 3 or this website relaunch?
Do you want to see other Kirby projects?
Head over to my website: https://medienbaecker.com/