Kirby 3 code editor plugin

Is there a way to have a textarea as a code editor that keep the code formatting?
Thank you!

If you use three backticks before and after your code blocks, it will keep the formatting…

1 Like

For fields that only contain code, check out the monospace property:

If you add language highlighting, you can pass the language after the opening backticks…

    /// some code

Thank you @texnixe! I was looking for something like this but for Kirby 3:

Still looking for an alternative! If you have suggestions, please let me know! :slight_smile:

The editor has a code block:

I just had a look and tried it but actually I was looking for a different thing.

At the moment I’m using a simple textarea (without any button) to add custom code in my page trough the panel but an editor like the one I linked in my previous answer would be useful! I don’t need to show the code… instead it will be rendered as HTML or CSS (for simple page related CSS customisations).

The textarea doesn’t have any colors, code formatting etc…

Anyway this new kirby editor you just suggested me is beautiful, I saw I can add the code block and then render it as HTML using a custom snippet but the editor is the same like having a textarea… so no colors, no formatting etc…

I agree that code highlighting would be a nice to have (as a plugin). I guess the reason I don’t really miss it personally is because for the documentation we don’t use the Panel but edit the text files manually.

Having said that, I’m not aware of any plugin that supports Panel syntax highlighting. Maybe if there is a need you can develop something with the community?

The Markdown field is based on CodeMirror which offers editing and syntax highlighting capabilities. Maybe it can be used as a base for such plugin:

That’s interesting… I know php but not as well as a developer…every time I tried to understand the dynamic of kirby’s plugin engine I crashed my head on the wall! :sweat_smile:

meanwhile I give it a try, I will ask to sylvainjule if he has some interest on adding this plugin… Thank you!

1 Like

A couple of months ago the fabulous @sylvainjule published this code-editor plugin.

(Found this thread googling it, so now it’s mentioned here for others who are in search of one)
Thanks Sylvain :pray:t3:

Regarding markdown - is it possible to use html markdown? For example when user clicks on B (bold) button, then text is wrapped in <bold>some text</bold> tags?

Currently if all data is passed as API to some other frontend (React), then those **some text** markdowns are useless…

p.s. figured it out, created custom textarea buttons which inserts and