Expand my Community achievements bar.

How to create a custom RTE plugin just like paragraph formats

Avatar

Level 2

I would like to create a custom RTE plugin just like paragraph formats (it will have the dropdown) we see in the RTE where upon clicking of a particular text in that custom plugin I would like to print it to the console. And for that custom plugin also I would like to set an icon.

 

Just like this I would like to implement. 

 

Thank you.

 

khaSHA_0-1698689713902.png

 

4 Replies

Avatar

Community Advisor

Hi,

 

Please refer to these articles where there is a good detail explanation about how to add a custom plugin for an RTE:

https://www.bounteous.com/insights/2022/01/06/custom-rich-text-editor-plugins-adobe-experience-manag...

https://medium.com/globant/build-a-custom-rte-plugin-with-chatgpt-for-aem-4e373487a6fe 

 

Hope this helps

 



Esteban Bustamante

Avatar

Level 2

@EstebanBustamante 

 

I am getting this error.

 

khaSHA_1-1698734990643.png

 

So I am registering the plugin like this /libs/clientlibs/granite/richtext/core/js/plugins/ParagraphFormatPlugin.js and even in the paraformat in uisettings i kept the items just like it is there but instead of paraformat i changed to my own 'translate' which I have written.

khaSHA_0-1698734907240.png

 

Avatar

Community Advisor

Are you following the examples I shared? There's a downloadable package available for you to customize. It seems the error you're encountering stems from improper registration of certain JavaScript components. Based on the examples I provided, make sure to register your plugin under the category 'rte.coralui3'. Kindly verify this and make use of the resources I shared.



Esteban Bustamante

Avatar

Administrator

@khaSHA Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

 



Kautuk Sahni