🚚 How to migrate to Kirby Tips & tutorials
Skip to content

Episode 21

02 Mar 2018

Originally published via email on March 2nd, 2018.

This is already the third Kosmos edition for this year, and a lot has happened during the last couple of weeks.

In case you missed it: Kirby 2.5.9 was released on February 27. It comes with some fixes and small improvements, with special focus on the Toolkit methods. See the changelog for details.

After a bit of a slowdown during the turn of the year, Kirby Next development has gathered momentum again and is taking shape more and more each day. We had a new Alpha to play with yesterday and will see regular updates from now on.

Kirby in the Wild

Theater Lulu
Theater

Kirby Enhanced

  • Kirby Mustache brings logic-less templating to Kirby. Templates can be parsed on the server via PHP or using JavaScript on the client side. Developed by Bruno Meilick (free).

  • If JPEG images are displayed with the wrong orientation in the Panel, Pedro Borges' Auto Orient Images plugin takes care to rotate them according to their EXIF orientation flag on upload (free).

  • Pascal Küsgen created the Responsive Image Kirbytag with support for the srcset attribute (free).

  • For users of Laravel Mix, Stefan Zweifel's Laravel Mix helper will come in handy to take care of versioning/cache busting CSS and JS files (free).

  • Carlos Tur has forked Kirby's original columns plugin and enhanced it with flexbox styling (free).

  • For a project I needed the possibility to add new subpage options to a select field on the fly, so I made the SelectPlus plugin (free).

  • The Kirby WebP plugin by Martin Folkers auto-generates WebP images when you upload JPEG or PNG images to the Panel. WebP is an image format that provides both lossless and lossy compression and promises smaller image sizes (free).

Always test third party plugins thoroughly before using them in production!

Kirby in Style: Themes

Since our last edition, a couple of new themes for Kirby have seen the light of day. Here is a little selection. For more themes, head over to http://www.getkirby-themes.com, a project created and maintained by Jonathan Baptistella.​

Scribe Theme is a minimalistic blog theme based on flexbox grid layout by Carlos Tur (paid).

Hipster is a theme Sander De La Marche originally developed for a concert venue but lends itself to other kinds of events as well (free).

Security

  • Pwned Passwords is a collection of half a billion passwords that have been exposed in data breaches. If you are unsure if your password is amongst them, you can test it against this database. You can also download the database for use in your applications. If your password is not in the database, that doesn't automatically mean your password is safe, though.

  • While using HTTPS has become a necessity for helping to secure the web and should be used everywhere, it is by no means the answer to every threat. Eric Law explores some common pitfalls and limitations.

  • Maybe you have already heard about how CSS can be abused to write a keylogger. Jake Archibald takes this a bit further, explaining how third party CSS in general is not safe to use.

JavaScript

CSS

  • Per Harald Borgen shares How to Make Responsiveness Super Simple with CSS variables.

  • Speaking of CSS variables, these can also be useful as a little hack for breakpoint debugging, as described in this short blog post by Emil Björklund.

  • CSS resets aim to remove styling inconsistencies between browsers. Every now and then, new resets come up, driven by the idea to provide the ultimate solution. If you are interested in comparing the results of different CSS resets, check out this tool, it might help you to find the best fit for your own projects.

Kirby Project

Some of you probably know Gilles Vauvarin from the Kirby forum. In a blog post, he shares his experience in setting up a web project as an entrepreneur (French language). His new project - Confdays - is based on Kirby and is scheduled to go online in April.

This & That

  • Polacode is a plugin for Visual Studio Code that lets you create beautiful screenshots of your code. Polacode is inspired by Carbon, a customizable online service.

  • GIF images are all over the place, but they eat up a lot of performance. In his Gifhancement tutorial, Michael Scharnagl explains how to convert GIFs to MP4 and embed them responsibly.

  • The Data Color Picker is a useful tool that makes it easy to pick palettes of visually equidistant colors that can be used in data visualizations like charts or maps.

  • And if you haven't read enough for today yet, here are 7 Practical Tips for Cheating at Design (without getting punished).