Expand my Community achievements bar.

SOLVED

Add new style to list in rtePlugings

Avatar

Level 3

What is the best approach to add new style to list in text? Checkmark ones:

/libs/foundation/components/text/cq:dialog/content/items/tabs/items/text/items/column/items/text/rtePlugins/lists

I want to add check mark style next to bullet and numbered.

1 Accepted Solution

Avatar

Correct answer by
Level 3

Thanks I could do that way with adding new option style. I wish I could add checkmark list icon next to these icons (Bullets/Numbered/Checkmark).

For now, I will go with adding style with new css class. 

In fact I need to add new node to list here:

/apps/myapp/components/base/widgets/rteconfig/lists/lists

Not sure what is the node and properties I have to use for it.

Thanks

View solution in original post

3 Replies

Avatar

Level 8

Add the list of styles as given below and then in your css file add the check mark image in css rule corresponding to the class name e.g 

.className1{

background:url(check.png) 10px 0px 

}

      jcr:primaryType="cq:Widget"
                    fieldLabel="Text"
                    height="200"
                    name="./text"
                    xtype="richtext">
                    <rtePlugins jcr:primaryType="nt:unstructured">
                        <styles
                            jcr:primaryType="nt:unstructured"
                            features="*">
                            <styles jcr:primaryType="cq:WidgetCollection">
                                <className1
                                    jcr:primaryType="nt:unstructured"
                                    cssName="className1"
                                    text="className1"/>
                                <className2
                                    jcr:primaryType="nt:unstructured"
                                    cssName="className2"
                                    text="className2"/>
                            </styles>
                        </styles>
                    </rtePlugins>
                </text>

Avatar

Correct answer by
Level 3

Thanks I could do that way with adding new option style. I wish I could add checkmark list icon next to these icons (Bullets/Numbered/Checkmark).

For now, I will go with adding style with new css class. 

In fact I need to add new node to list here:

/apps/myapp/components/base/widgets/rteconfig/lists/lists

Not sure what is the node and properties I have to use for it.

Thanks