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
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

SIghtly ClientContext conflict on custom components

bfvaughn
Level 3
Level 3

Hello,

When client context is included on a page with baked in custom components, those components are no longer available to edit in author mode.  I see the standard cq-placeholder for the component but when mousing over the component it is not highlighted and the edit options do not display.  The parsys components and OOTB AEM components work fine.

 

//included in body.html <sly data-sly-resource="${ @path='clientcontext', resourceType='cq/personalization/components/clientcontext'}"  /> //included in content.html on our template <div data-sly-resource="${'./text' @ resourceType='project/components/content/text'}"></div> <section data-sly-resource="${'./mainParsys' @ resourceType='foundation/components/parsys'}"></section>
1 Accepted Solution
Amit_Kumar
Correct answer by
Community Advisor
Community Advisor

bfvaughn wrote...

Hello,

When client context is included on a page with baked in custom components, those components are no longer available to edit in author mode.  I see the standard cq-placeholder for the component but when mousing over the component it is not highlighted and the edit options do not display.  The parsys components and OOTB AEM components work fine.

 

  1. //included in body.html
  2. <sly data-sly-resource="${ @path='clientcontext', resourceType='cq/personalization/components/clientcontext'}" />
  3.  
  4. //included in content.html on our template
  5. <div data-sly-resource="${'./text' @ resourceType='project/components/content/text'}"></div>
  6. <section data-sly-resource="${'./mainParsys' @ resourceType='foundation/components/parsys'}"></section>

 

 

 

It seems like a path conflict to me, can you change <sly data-sly-resource="${ @path='clientcontext', resourceType='cq/personalization/components/clientcontext'}" /> to  <div data-sly-resource="${ @path='clientcontext-new', resourceType='/libs/cq/personalization/components/clientcontext'}" data-sly-unwrap></div> 

View solution in original post

0 Replies
Lokesh_Shivalingaiah
Community Advisor
Community Advisor

Can you try with 

<div data-sly-resource="${'clientcontext' @ resourceType='cq/personalization/components/clientcontext'}" data-sly-unwrap></div> 

bfvaughn
Level 3
Level 3

Same issue.  In touch UI the components are not editable.  

Amit_Kumar
Correct answer by
Community Advisor
Community Advisor

bfvaughn wrote...

Hello,

When client context is included on a page with baked in custom components, those components are no longer available to edit in author mode.  I see the standard cq-placeholder for the component but when mousing over the component it is not highlighted and the edit options do not display.  The parsys components and OOTB AEM components work fine.

 

  1. //included in body.html
  2. <sly data-sly-resource="${ @path='clientcontext', resourceType='cq/personalization/components/clientcontext'}" />
  3.  
  4. //included in content.html on our template
  5. <div data-sly-resource="${'./text' @ resourceType='project/components/content/text'}"></div>
  6. <section data-sly-resource="${'./mainParsys' @ resourceType='foundation/components/parsys'}"></section>

 

 

 

It seems like a path conflict to me, can you change <sly data-sly-resource="${ @path='clientcontext', resourceType='cq/personalization/components/clientcontext'}" /> to  <div data-sly-resource="${ @path='clientcontext-new', resourceType='/libs/cq/personalization/components/clientcontext'}" data-sly-unwrap></div> 

View solution in original post

bfvaughn
Level 3
Level 3

No joy.  It is just weird that the mouse over actions work for the parsys but not the custom components.  There must be some conflict in the javascript causing the mouse over events to not trigger.

vsharm
Level 4
Level 4

For us it even worked if we change "sly" tag to "div" tag like below

<div data-sly-resource="${'clientcontext' @ resourceType='cq/personalization/components/clientcontext'}"></div>