Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

Picklist for touch UI rich text editor

viruh15818023
Level 2
Level 2

I need to implement a pick list plugin for a touch UI rich text editor.  I found this thread but wasn't helpful. the below plugin isn't registered in plugin registry.

When I try to extend this plugin it's undefined.

"/libs/mcm/campaign/components/touch-ui/clientlibs/rte/personalizationplugin/plugin.js".

Re: Using insertvariables RTE plugin in Touch Dialog config question

Did anybody implement the similar feature on touch UI RTE? I would greatly appreciate some examples.

I'm using AEM 6.2.

Thanks in Advance.

Viru

Message was edited by: Viru Hosamath

1 Accepted Solution
GaneshM
Correct answer by
Level 3
Level 3

Viru,

You can archive using Styles Plugin & inserthtml command (this.editorKernel.relayCmd('inserthtml', className);)

FYI,

1633683_pastedImage_3.png

Thanks!

View solution in original post

9 Replies
viruh15818023
Level 2
Level 2

Vipin

thank you for your reply.

basically, I would like to implement a drop down list where an author can insert value into the RTE to personalize the content. 

Somethinkg like, a dropdown list contains state names.

Let me give a try.

thanks

viru

GaneshM
Level 3
Level 3

Hi Viru,

Here is the example and code snippet to how to extend the plugin & integrate with toolbar.

Second styles plugin for RTE Touch UI AEM 6.3 

You can get some ideas here.

Thanks!

viruh15818023
Level 2
Level 2

Ganesh,

Thank you for your comments. does this work for 6.2?

We are using AEM 6.2

Thanks,

Viru

GaneshM
Level 3
Level 3

I'm not sure Viru, but the approach & steps are common for 6.2 & 6.3. You may need to change coral version like

/libs/clientlibs/granite/coralui2/optional/rte/js/components/rte/ui/CuiToolbarBuilder.js, other than that all the files are same.

Thanks!

viruh15818023
Level 2
Level 2

Ganesh,

is this the original blog you were referring too?

AEM | RTE – Custom Styles Plugin – Touch UI – Need is the mother of invention …

I installed the package as is on AEM 6.2 I'm getting following error.

touchui.js:720 Uncaught TypeError: Cannot read property ‘toolbar’ of undefined

at instanceGenerator._getUISettings (touchui.js:720)

at instanceGenerator.createToolbar (rte.js:39244)

at instanceGenerator.createToolbar (rte.js:3720)

I've configured the plugin as follows:

<inline jcr:primaryType="nt:unstructured" toolbar="[fontstyles#fontstyles]">

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

<fontstyles jcr:primaryType="nt:unstructured" items="fontstyles:getStyles:styles-pulldown" ref="fontstyles"/>

</popovers>

</inline

just want to make sure, I'm using the plugin correctly.

Thanks,

Viru

GaneshM
Level 3
Level 3

I afraid not, we had some issue when we follow that blog post.

Can you please try the plug-in from here GitHub - ganeshmurthi/AEM: AEM Code Snippets.

Let me know if you need any clarification.

Thanks!

GaneshM
Correct answer by
Level 3
Level 3

Viru,

You can archive using Styles Plugin & inserthtml command (this.editorKernel.relayCmd('inserthtml', className);)

FYI,

1633683_pastedImage_3.png

Thanks!

View solution in original post