Expand my Community achievements bar.

Radically easy to access on brand approved content for distribution and omnichannel performant delivery. AEM Assets Content Hub and Dynamic Media with OpenAPI capabilities is now GA.
SOLVED

How to enable Style Plugin in RTE for content fragments

Avatar

Level 2

I am working on 6.5 AEM and using RTE for Content fragment. I don't see the style plugin in RTE editor, image added below. Please let me know how I can enable Style plugin in RTE editor for content fragments.

I went through some of the blogs saying to override StyledTextEditor.js and update inline section to enable any missing plugin but I could not find what value I should update to enable style plugin.

 

maddy_23_0-1717473947931.png

 

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Level 6

styles should be added in few other places as well

"multieditorFullscreen": {
 "toolbar": [
"#styles",
]
 "styles": {
                "ref": "styles",
                "items": "styles:getStyles:styles-pulldown"
           }
}
 
  "uiSettings": {
  "inline": {
 "toolbar": [
"#styles",
]
 "popovers": {
   "styles": {
                "ref": "styles",
                "items": "styles:getStyles:styles-pulldown"

              }
}
}
}
Hoping this will help you.

View solution in original post

7 Replies

Avatar

Level 6

Hi ,

Inside StyledTextEditor,

add property "styles" inside

"rteplugins" {

 "styles": {
          "features": "*",
          "styles": {
            "eyebrow": {
              "text": "Eyebrow",
              "cssName": "eyebrow"
            },
      }

}

 
In this way u have to add styles, let me knwo if u still face issues.
Thank u.

Avatar

Level 6

And, for the clientlibs with StyledtextEditor.js give categories as 

dam.cfm.authoring.contenteditor.v2 this. which is same as of libs/styledtexteditor.js clientlib category.

Avatar

Level 2

@Keerthi0555  I updated StyledTextEditor.js like below 

"rtePlugins": {
"styles": {
"features": "*",
"styles": {
"eyebrow": {
"text": "Eyebrow",
"cssName": "eyebrow"
},

..

 

and tried both "#styles" or "styles#eyebrow"

in uiSettings like below

"uiSettings": {
"cui": {
"additionalClasses": {
"fullscreenstart": {
"classes": "",
"command": "fullscreen#start"
}
},
"inline": {
"toolbar": [
"#format",
"#justify",
"#lists",
"#styles",

.

.

.
}

},

 

But still, it's not working. Do you have working StyledTextEditor.js with style plugin. 

Avatar

Correct answer by
Level 6

styles should be added in few other places as well

"multieditorFullscreen": {
 "toolbar": [
"#styles",
]
 "styles": {
                "ref": "styles",
                "items": "styles:getStyles:styles-pulldown"
           }
}
 
  "uiSettings": {
  "inline": {
 "toolbar": [
"#styles",
]
 "popovers": {
   "styles": {
                "ref": "styles",
                "items": "styles:getStyles:styles-pulldown"

              }
}
}
}
Hoping this will help you.

Avatar

Administrator

@maddy_23 I hope you found the AEM community helpful. We look forward to your return as either a learner or a contributor. The community thrives with SMEs like you. Please encourage your AEM peers to join and contribute. Happy AEM learning!



Kautuk Sahni