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

Parsys customization issue

arvind
Level 4
Level 4

Dear Team,

 

As per project req,we need to customize parsys in order to show custom text.

AEM Version:6.4.0

 

I followed this URL: https://helpx.adobe.com/experience-manager/using/overlay_parsys.html

 

and found working as I am able to display my own custom text.

Custom.jpg

 

 

 

Problem Statement:

 

Once I insert any component into my new customized parsys component e.g title component, I give some title and it displays on Page in edit mode for first time. But when I refresh page either in edit mode or disabled mode,Title component does not get displayed on Page. It is happening with all components.

 

Although I can see content getting stored properly in node under crx.

 

Any help would be really appreciated. Thanks in advance.

 

 

 

1 Accepted Solution
Andrei_Dantsou
Correct answer by
Level 4
Level 4

Hello @arvind ,

In the example you've mentioned, the components inserted to the custom parsys are not shown due to this condition in sightly - "paragraph.cssClasses".

After removing it from the line 31 of parsys.html, the components are shown:

```<sly data-sly-test="${!paragraph.columns && paragraph.resourceType}" class="cq-placeholder section" data-emptytext="" data-sly-resource="${paragraph.resourcePath @ resourceType=paragraph.resourceType, decorationTagName=''}" />```

Andrei_Dantsou_0-1598340110254.png

Regards

 

View solution in original post

5 Replies
Nikhil-Kumar
Community Advisor
Community Advisor

@arvind 

How are you rendering the component Sightly or React ?

Andrei_Dantsou
Correct answer by
Level 4
Level 4

Hello @arvind ,

In the example you've mentioned, the components inserted to the custom parsys are not shown due to this condition in sightly - "paragraph.cssClasses".

After removing it from the line 31 of parsys.html, the components are shown:

```<sly data-sly-test="${!paragraph.columns && paragraph.resourceType}" class="cq-placeholder section" data-emptytext="" data-sly-resource="${paragraph.resourcePath @ resourceType=paragraph.resourceType, decorationTagName=''}" />```

Andrei_Dantsou_0-1598340110254.png

Regards

 

View solution in original post

arvind
Level 4
Level 4

@Andrei_Dantsou , Thank you for your reply. It works fine now.

 

But now I see a new problem:

 

once content component is placed inside this customized parsys, It blocks inserted component and not able to edit.

 

Below are two images:

First image is after I insert a component "plain HTML render" and second is after I refresh this page:

 

Before Page Refresh:

before-page-refresh.jpg

 

After Page Refresh:

after-page-refresh.jpg

 

Inserted Code for parsys in component:

<div class="cq-placeholder section" data-emptytext="Custom text"></div>

<sly data-sly-resource="${path @ resourceType='/apps/myproject/components/content/parsys'}"></sly>

 

 

Thank you in advance.