Expand my Community achievements bar.

Join us in celebrating the outstanding achievement of our AEM Community Member of the Year!

[AEM][Universal Editor] Extend wysiwyg

Avatar

Level 1

1/14/25

Request for Feature Enhancement (RFE) Summary: Allow customize wywisyg inline and richtext. At the moment is limited the wysiwyg and only allow some actions instead to use the full power of the wysiwyg.
Use-case:  
Current/Experienced Behavior:  
Improved/Expected Behavior: With universal editor at the moment is imposible to customize or extend buttons for wysiwyg inline and richtext component. Should be fantastic to have configuration to allow hide/add new buttons in the wysywig. One simple thing as a color picker.
Environment Details (AEM version/service pack, any other specifics if applicable):  
Customer-name/Organization name: Santander
Screenshot (if applicable):  
Code package (if applicable):  
2 Comments

Avatar

Level 5

1/19/25

To extend the WYSIWYG editor in AEM (Universal Editor) and add buttons like a color picker:

Modify WYSIWYG Configuration: Update the cq:editorConfig to include custom toolbar buttons and plugins (e.g., ColorPicker).
Custom Javascript: Add custom JavaScript for additional features (like custom button actions).
Update Universal Editor: Ensure changes are reflected in the Universal Editor settings.
Test: Validate the extended functionality works as expected.

Example configuration for color picker:

{
"toolbar": [
["Bold", "Italic", "-", "ColorPicker"]
],
"plugins": [
"ColorPicker"
]
}

This will allow you to customize the editor's functionality.

Avatar

Level 1

1/19/25

This solutions doesn't work with universal editor/new editor Content Fragment. Skip the confirmation from cq:editorConfig and only use custom config from univeraleditor JS