Picklist for touch UI rich text editor | Community
Skip to main content
V
viruh15818023
Level 2
November 28, 2018
Solved

Picklist for touch UI rich text editor

  • November 28, 2018
  • 9 replies
  • 5409 views

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

    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 GaneshM

    Viru,

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

    FYI,

    Thanks!

    9 replies

    vipins5188
    vipins5188
    Level 3
    November 28, 2018

    You can refer this color picker example for touch ui RTE

    Experiencing Adobe Experience Manager - Day CQ: AEM 63 - Touch UI RTE (Rich Text Editor) Color Picker Plugin for InPlace…

    V
    viruh15818023Author
    Level 2
    November 28, 2018

    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
    GaneshM
    Level 3
    November 28, 2018

    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!

    V
    viruh15818023Author
    Level 2
    November 28, 2018

    Ganesh,

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

    We are using AEM 6.2

    Thanks,

    Viru

    GaneshM
    GaneshM
    Level 3
    November 28, 2018

    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!

    V
    viruh15818023Author
    Level 2
    November 29, 2018

    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
    GaneshM
    Level 3
    November 29, 2018

    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
    GaneshMAccepted solution
    Level 3
    November 29, 2018

    Viru,

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

    FYI,

    Thanks!

      V
      viruh15818023Author
      Level 2
      December 4, 2018

      GaneshM

      Thank you for your help! it works

      Terms & ConditionsAccessibility statement

      Loading footer...