RTE CSS adding on Paraformats | Community
Skip to main content
Level 6
May 18, 2023
Solved

RTE CSS adding on Paraformats

  • May 18, 2023
  • 1 reply
  • 575 views

In RTE I have one scenario where in Paraformat

I want to add class name="para" when the Paragraph is selected, <p class="para">TEXT</p>

when Quote is selected <quote class="quotations">


How can we do that in RTE?

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

Hello @ronnie09 

You can extend the core text component then you can set properties in your custom component's dialog xml to your requirements like this

 

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="nt:unstructured" jcr:title="Text" sling:resourceType="cq/gui/components/authoring/dialog" helpPath="https://www.adobe.com/go/aem_cmp_text_v2"> <content jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <tabs jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/tabs" maximized="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <properties jcr:primaryType="nt:unstructured" jcr:title="Properties" sling:resourceType="granite/ui/components/coral/foundation/container" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <columns jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <column granite:class="cq-RichText-FixedColumn-column" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <graniteCustom jcr:primaryType="nt:unstructured" sling:resourceType="/granite/ui/components/coral/foundation/includeclientlibs" categories="[ous.commons.rte.text.findreplace]"/> <text jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" name="./text" useFixedInlineToolbar="{Boolean}true"> <rtePlugins jcr:primaryType="nt:unstructured"> <paraformat jcr:primaryType="nt:unstructured" features="*"> <formats jcr:primaryType="cq:WidgetCollection"> <default_p jcr:primaryType="nt:unstructured" description="Paragraph" class="para"/> <default_blockquote jcr:primaryType="nt:unstructured" description="Quote" class="quotations"/> </formats> </paraformat> </rtePlugins> </text> </items> </column> </items> </columns> </items> </properties> </items> </tabs> </items> </content> </jcr:root>

 

 

1 reply

AsifChowdhury
Community Advisor
AsifChowdhuryCommunity AdvisorAccepted solution
Community Advisor
May 19, 2023

Hello @ronnie09 

You can extend the core text component then you can set properties in your custom component's dialog xml to your requirements like this

 

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="nt:unstructured" jcr:title="Text" sling:resourceType="cq/gui/components/authoring/dialog" helpPath="https://www.adobe.com/go/aem_cmp_text_v2"> <content jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <tabs jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/tabs" maximized="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <properties jcr:primaryType="nt:unstructured" jcr:title="Properties" sling:resourceType="granite/ui/components/coral/foundation/container" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <columns jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns" margin="{Boolean}true"> <items jcr:primaryType="nt:unstructured"> <column granite:class="cq-RichText-FixedColumn-column" jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/container"> <items jcr:primaryType="nt:unstructured"> <graniteCustom jcr:primaryType="nt:unstructured" sling:resourceType="/granite/ui/components/coral/foundation/includeclientlibs" categories="[ous.commons.rte.text.findreplace]"/> <text jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" name="./text" useFixedInlineToolbar="{Boolean}true"> <rtePlugins jcr:primaryType="nt:unstructured"> <paraformat jcr:primaryType="nt:unstructured" features="*"> <formats jcr:primaryType="cq:WidgetCollection"> <default_p jcr:primaryType="nt:unstructured" description="Paragraph" class="para"/> <default_blockquote jcr:primaryType="nt:unstructured" description="Quote" class="quotations"/> </formats> </paraformat> </rtePlugins> </text> </items> </column> </items> </columns> </items> </properties> </items> </tabs> </items> </content> </jcr:root>