How to change parsys text "Drag components here"?

[Shalini_Gupta]

Hi,

We have a requirement,in AEM 6.2, wherein we have to change the parsys placeholde text from"Drag components here" to some custom text like " Drag list component here" etc.

The parsys is placed inside other components.

Code snippet of the component.
        <div class="container">
              <div class="div-table" id='datafeedparsys' data-sly-resource="${'./feedparsys' @resourceType='wcm/foundation/components/parsys'}" data-sly-unwrap></div>
        </div>

We want to customize this parsys text.

We have already tried the following approaches, but they didn't work as expected.

1. With this approach, we were able to change the text, but the parsys position gets fixed and it starts overlapping.

http://aemtricks.blogspot.com/2016/01/customizing-default-parsys-text-of-aem.html

2. With this approach, the parsys stops behaving like parsys with the changed text.

http://stackoverflow.com/questions/25037171/setting-emptytext-on-a-parsys-from-sightly-aem6

[edubey]

Not sure about the approaches you mentioned but this is something I used and works fine

HTML

<p data-emptytext="[Header Teaser (Updated): Please enter the appropriate values]" class="cq-placeholder" ></p>

Output

[Shalini_Gupta]

edubey wrote...

Not sure about the approaches you mentioned but this is something I used and works fine

HTML

1. <p data-emptytext="[Header Teaser (Updated): Please enter the appropriate values]" class="cq-placeholder" ></p>

Output

this changes the component's placeholder text, our requirement is to change the parsys placeholder text.

[smacdonald2008]

Why is changing this  text a requirement? What benefit is there? 

Look here: https://forums.adobe.com/thread/982208

[Shalini_Gupta]

The post at the link seems to be irrelevant with AEM 6.2 and sightly in place.
Our requirement is to have parsys inside multiple components. So, to avoid any confusion for the author, the text change is required.

[nikhilsinghal · Accepted solution]

I also faced a similar issue and after finding no suitable answers anywhere, decided to do my own solution and wrote a detailed blog entry explaining the steps.

You can find all the relevant details here: -

https://scribcopia.wordpress.com/2017/08/13/customizing-text-within-parsys-touch-ui/

Happy AEMing !!

[smacdonald2008]

Really nice community content!!!

[Shalini_Gupta]

Thanks nikhilsinghal​

This solved the problem

[reggie_7]

Hi, I've implemented a similar solution here: Enigmatic parsys and ComplexComponent.java · reggie7/aem-tools Wiki · GitHub since some time ago I was facing the same issue adobe - How do I change parsys drop area text in AEM 6.3's Touch UI? - Stack Overflow​​. My approach is using the same point of entry as nikhilsinghal​ 's article describes, but I've additionally merged it with something else I had before for classic UI. Anyway I'm still hoping such a feature would eventually make it to the AEM OOTB: A nice way to customize "Drag components here"? ...

[selva_billa]

Hi Team,

The link is not working. Can you please update ?

/S