Customizing RTE Plugin | Community
Skip to main content
Level 2
March 29, 2022

Customizing RTE Plugin

  • March 29, 2022
  • 2 replies
  • 842 views

I'm trying to add a custom dropdowns under paraformat which will basically change the text size when its selected just like the heading tags. The format I need to hit is <div class="large-font">. 

I tried to create the styles node referred in styles plugin for RTE

 

<styles jcr:primaryType="nt:unstructured" features="*"> <styles jcr:primaryType="cq:WidgetCollection"> <large jcr:primaryType="nt:unstructured" cssName="large-font" text="large-font"/> <medium jcr:primaryType="nt:unstructured" cssName="medium-font" text="medium-font"/> <small jcr:primaryType="nt:unstructured" cssName="small-font" text="small-font"/> </styles> </styles>

 

but a blank space shows up in the dropdown at the end. is there anything I am missing. Thanks for any help

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

2 replies

Ravi_Pampana
Community Advisor
Community Advisor
March 29, 2022

Hi,

 

We added custom styles tab in RTE like below and it is working as expected

 

<styles jcr:primaryType="nt:unstructured" features="*">

    <styles jcr:primaryType="nt:unstructured">

           <size1 jcr:primaryType="nt:unstructured" cssName="txt--1"  text="Size 1"/>

           <size2 jcr:primaryType="nt:unstructured" cssName="txt--2" text="Size 2"/>

    </styles>

</styles>

Try to change from cq:WidgetCollection to nt:unstructured

HiteshRa3Author
Level 2
March 30, 2022

I changed cq:WidgetCollection to nt:unstructured  but it still shows a blank space only 

 

DEBAL_DAS
New Member
March 30, 2022

We could follow @ravi_pampana suggestion in terms of implementation to have dropdown with options in Touch UI. 

Please note that we normally use jcr:parimaryType=cq:WidgetCollection with classic ui dialog editor only.

Debal Das, Senior AEM Consultant