How to add Richtext plugins like Color picker, Anchor, Special characters, Styles, Paragraph format in Richtext field of content fragment.

Question

We are able to add onlySuper scriptSub scriptSource edit plugins  in richtext of content fragment.

EstebanBustamante · Accepted Answer

Hi, Can you check this: https://lhotsetechnologies.com/blog/enable-rte-plugins-for-content-fragment/ ?

HrishikeshKagne · Answer

Hi @ssin93 ,To add additional plugins like Color Picker, Anchor, Special Characters, Styles, and Paragraph Format to the RichText field of a Content Fragment in AEM, you need to customize the RichText Editor configuration in AEM. Here’s a step-by-step guide to achieve this:Steps to Add Plugins to the RichText Field in Content FragmentsAccess the RichText Editor Configuration:Go to CRXDE Lite: http://:/crx/de/index.jsp.Navigate to the Correct Configuration Node:Navigate to /libs/settings/wcm/policies/editors/contentfragment.If the path doesn’t exist, you can create it or use the path /apps/settings/wcm/policies/editors/contentfragment for your custom configurations to avoid overwriting the default ones.Create/Modify the Configuration Node:Under the contentfragment node, create a node named rte.Create a config node under rte.Under config, create a node named full.Add the Desired Plugins:Add the following properties to the full node { "features": [ "bold", "italic", "underline", "strikethrough", "subscript", "superscript", "editSource", "justifyLeft", "justifyCenter", "justifyRight", "justifyBlock", "oList", "uList", "indent", "outdent", "link", "unlink", "anchor", "image", "removeFormat", "undo", "redo", "specialCharacters", "styles", "paragraphFormat", "color" ]} Make sure each feature you want to enable is listed here. You can add or remove features as needed.Example Node Structure: The node structure in CRXDE Lite should look something like this: /apps /settings /wcm /policies /editors /contentfragment /rte /config /full - features [String Array] Where features is a property with the array of features listed above.Save and Test:Save your changes in CRXDE Lite.Go to your AEM Author instance and open a Content Fragment to check if the RichText editor now includes the additional plugins.NotesCustom Styles: If you want to add custom styles, you might need to configure a custom style node:Create a node under /apps/settings/wcm/policies/editors/contentfragment/rte/config named styles.Add properties for each style you want to define.Color Picker Configuration:If you need to configure specific colors for the color picker, you can do so under the uiSettings node in the same configuration path.Example Configuration for Custom Styles { "styles": [ { "name": "Custom Style 1", "cssName": "custom-style-1" }, { "name": "Custom Style 2", "cssName": "custom-style-2" } ]} Additional ConfigurationIf additional configuration is needed for specific plugins (like special characters or color picker), you might need to refer to the plugin documentation and add necessary configurations under appropriate nodes.By following these steps, you should be able to customize the RichText field in Content Fragments to include plugins like Color Picker, Anchor, Special Characters, Styles, and Paragraph Format, making the RichText Editor more powerful and flexible for content authors.

Steps to Add Plugins to the RichText Field in Content Fragments

Notes

Example Configuration for Custom Styles

Additional Configuration

Sign up

Login with SSO

Login to the community

Login with SSO