Writer Field Custom Mark for Remix Icons

The CMS Questions
7

@saschabregenhorn I solved it with a simple plugin. However, I use FontAwesome icons. But the concept can easily be adapted for Remix icons. This is my solution:

site/plugins/fa-icons/index.php

<?php
Kirby::plugin('yourname/fa-icons', [
    'hooks' => [],
    'tags' => [],
    'components' => [],
]);

function replaceIcons($text) {
    return preg_replace_callback('/\[fa="([^"]+)"\]/', function($matches) {
        $iconName = htmlspecialchars($matches[1], ENT_QUOTES, 'UTF-8');
        return '<i class="fas fa-' . $iconName . '"></i>';
    }, $text);
}

site/blueprints/pages/default.yml

textwithicon:
  type: writer

And in the writer field, you use a placeholder:

Here is an example text with an icon [fa=“star”]

site/templates/default.php

<?= replaceIcons($page->textwithicon()->kt()) ?>

This is what the output looks like in the source code:

<p>Here is an example text with an icon <i class="fas fa-star"></i></p>