Customize markdown editor UI?

[01ivr3]

Is it possible to customize the editor ui bar of the markdown widget?

For example, could an instance of the markdown widget be customized to only shown Bulleted List and Numbered List? Or not show certain options like say Code and Code Block? Or if it not per instance, can it be customized globally so that all instances of the markdown widget in the CMS appear with or without certain options?

[aleksandarbasara]

@01ivr3 Take a look at the PR #1169 and the KitchenSink

[01ivr3]

@aleksandarbasara I looked at both, but don't see how either solves being able to customize the stock UI toolbar of the markdown widget. KitchenSink seems to provide an example of adding a custom component to the Markdown editor, same as the example in the docs. And PR #1169 is regarding a Modular Content Widget that could enable declaring multiple different widget types for a single repeating section. Do I have this right?

[erquhart]

You're right, that toolbar can't be customized, but it should be. It was actually built for simple customization, but we never went the whole way. A PR for this would be fine.

[Dammmien]

@erquhart I can take a look, does this kind of conf is ok for you ?

- ...
- {label: "Markdown", name: "markdown", widget: "markdown", buttons: ["bold", "italic", "link"]}
- ...

If no buttons field is specified we display all the buttons otherwise we display the list ?

[erquhart]

@Dammmien sorry, I was out for a few days. Looks great, thanks for taking this on!

[PaulEibensteiner]

Hi everyone, I'm working with Netlify CMS and Hugo and I am trying to achieve the opposite, adding widgets to the toolbar. There is a good explanation of how to build custom widgets (editor components), which create their own input fields inside the body (like the youtube widget). But I would need one, which uses the selected text or paragraph (Basically I only want to be able to add a string at the beginning and at the end of selected text/paragraph). To add for example buttons for Text color or similar things.
thx in advance for any help

[erquhart]

Can you give an example input/output? Is this to support shortcodes in your static site generator?

[PaulEibensteiner]

Shortcodes too, but also for example a horizontal rule (like in issue 1378, the solution proposed by the author is visually pretty weird) - and possibly other markdown styling

[erquhart]

The toolbar will pretty much only ever house buttons that correspond to features of Markdown, anything outside of that is generally going to correlate with a shortcode and be handled by custom editor components, which I think you already understand based on your comment.

Since horizontal rules are a part of markdown, a button can definitely be added to the editor, we'd take a PR for that.

[erquhart]

@PaulEibensteiner closing this, but comment on #1378 if you'd like to PR for horizontal rule support.

[PaulEibensteiner]

Sounds legit, what bothers me more is probably how the blocky custom editor components looks versus the elegant on/off toggles - but not reason for a change