How To Add Custom Class In Wagtail Richtextfiled

how can i add button which adds class in hallo.js editor? Here is my code, but it dont works, it ony register fuction in wagtai;s edit interface. In the end I need to add any clas

Solution 1:

As mentioned in the Wagtail customisation docs, you need to call registerHalloPlugin. You'll also need to configure the whitelist to allow your <span> element - rich text fields intentionally don't allow inserting arbitrary HTML. (See https://stackoverflow.com/a/38097833/1853523 for more detail.)

However, I would strongly encourage using StreamField for this, rather than extending the rich text editor. The whole purpose of Wagtail is to keep a separation between the information content of pages, and its presentation. A button to say "center this text" is purely presentation - that's a detail that belongs in template code, not in your article content. Instead, you should ask: what is the purpose of this text? Is it a block-quote, a testimonial, an advert? Create block types for that, and then think about how to style them in the template. You'll have much more control over the presentation that way.

(further reading: Rich text fields and faster horses)