Visual-markdown editor: How add new button in toolbar


Visual Markdown Editor
it’s possible to add a new button in the toolbar ?


I don’t see an option for that. It’s probably doable by modifying the plugin’s source code.

But adding a button is like 1-5% of the work. 95-99% of the work is implementing the feature that the button calls. So, what kind of button do you need? What would it do?

for example a custom kirby tag: (gallery: gallery_1)

I see. Then you can probably add it by duplicating and modifying the code for some of the existing buttons (probably the link or the image button). I suspect you’ll need some HTML and JavaScript skills.

Okay I set a new button in the toolbar:


        gallery: function () {
            if (self.options.kirbytext) {
                self.insert('(gallery: gallery name)');


        action: 'gallery',
        className: 'fa fa-id-badge'


    protected $defaultValues = [
        'header1' => 'h1',
        'header2' => 'h2',
        'tools'   => [

but the button symbol ‘fa fa-id-badge’ is not displayed.
What I do wrong ?

It’s a new icon in FA 4.7, which is not included in Kirby 2.4.0

Can be problematic if I include two Versions of FA ?

I don’t know if that can cause an issue, but I wouldn’t do it. If you really need 4.7 and you cannot wait until it is incorporated in a future Kirby version, I’d actually replace the fonts in the core and change the css accordingly rather than loading two versions.

The easiest solution would be to choose another icon.

Okay I choose another icon.

Thank’s for the help.