AEM Cloud Service - CSS and Color Picker Plugin for Rich Text Editor (RTE) | AEM Community Blog Seeding

[kautuk_sahni]

AEM Cloud Service - CSS and Color Picker Plugin for Rich Text Editor (RTE) by Sreekanth Choudry Nalabotu

Abstract

AEM Cloud Service - CSS and Color Picker Plugin for Rich Text Editor (RTE)
Goal
AEM Cloud Version : 2021.3.5026.20210309T210727Z-210225 (March 09, 2021)

This post explains adding a plugin to RTE (Rich Text Editor - /libs/cq/gui/components/authoring/dialog/richtext) for adding custom CSS and color to text...

Package install contains a Text component with design dialog with plugin configuration - /apps/eaem-cs-rte-plugin-color-picker/components/text/cq:design_dialog/content/items/tabs/items/plugins/items/eaem-aem-fonts

Solution
1) Create the Picker configuration dialog /apps/eaem-cs-rte-plugin-color-picker/clientlibs/fonts-plugin/font-selector and add categories=eaem.rte.font.plugin in /apps/eaem-cs-rte-plugin-color-picker/clientlibs/fonts-plugin/font-selector/jcr:content/head/clientlibs

2) Add any custom styles for the author user to (pick and apply on text using the plugin) in clientlib base eg. /apps/eaem-cs-rte-plugin-color-picker/clientlibs/clientlib-base/rte-fonts.css

Read Full Blog

AEM Cloud Service - CSS and Color Picker Plugin for Rich Text Editor (RTE)

Q&A

Please use this thread to ask the related questions.