Expand my Community achievements bar.

July 31st AEM Gems Webinar: Elevate your AEM development to master the integration of private GitHub repositories within AEM Cloud Manager.
SOLVED

How to add new style to bullet list in RTE in AEM 6.5

Avatar

Level 9

I want to change the colour of bullet list inside rte. So I created a new clientlibs with categories (rte.coralui3, cq.authoring.editor) and added my style definition and linked the created clientlibs inside my dialog but the clientlibs is not picked up.

 

Clientlibs changes

Mario248_0-1683274099453.png

Dialog 

Mario248_1-1683274148053.png

I am following up this forum https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/add-style-to-rte-6-3-lt-ul.... But it is not working in AEM 6.5. Am I missing anything ?

 

 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hello @Mario248 ,

I think it's your CSS syntax problem. You missed using ->    ::marker

.cq-RichText-editable ul li::marker {
    color: #ffc107;
}

 And also make sure your clientlib is imported properly using extraClientlibs or with default clientlib

View solution in original post

4 Replies

Avatar

Community Advisor

Hello @Mario248 ,
Make sure you set allowProxy="{Boolean}true" this property in your clientlib

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:ClientLibraryFolder"
    allowProxy="{Boolean}true"
    categories="your.clientlib.category/>

Documentation: Using Client-Side Libraries | Adobe Experience Manager

Avatar

Level 9

Thanks for your reply. I added allowProxy prop but still it is not working. 

Mario248_0-1683292143504.png

 

Avatar

Correct answer by
Community Advisor

Hello @Mario248 ,

I think it's your CSS syntax problem. You missed using ->    ::marker

.cq-RichText-editable ul li::marker {
    color: #ffc107;
}

 And also make sure your clientlib is imported properly using extraClientlibs or with default clientlib

Avatar

Community Advisor

If it is only for Author then you don't need to make it proxy.

But you need to target the element with the proper selector as mentioned by @Sady_Rifat 
The another way to add external CSS to RTE(cq/gui/components/authoring/dialog/richtext) field using externalStyleSheets property

externalStyleSheets=/apps/myapp/clientlibs/css/richtext.css"



Arun Patidar