AEM 6.3 - using parsys in htl files
[Thread Edited By Adobe]
/*Don’t forget to meet and greet your fellow peers virtually by telling them about yourself here.
Go ahead and to it now: https://adobe.ly/3eDnB4v */
Actual Post:
Hi All,
I am working with a HTL template and wanted to add some parsys components so we can make changes from the front end interface. Adding images, specifically.
My question is in regards to parsys resources. I have these tags in my html.
<div class="logo" style="height:100px;">
<sly data-sly-resource="${ @ resourceType='wcm/foundation/components/parsys'}"></sly>
</div>
The problem is that from the front end editor these show as very tiny lines, and its impossible to click them. And if I click them and add an image to them, I have to refresh my browser because the changes aren't reflected in my current session. I don't see any errors in the console log.
Is there something I need to do to make these bigger? Viewing the source shows them having a class as container is-disabled. Could that be my issue? I can add a new component to the ones I can click, but clicking them is the hard part. If you also have any ideas for why I may have to refresh the browser for any changes to show up. (I.E, I add a new image but the option to configure it does not show up until I refresh the page)
<div data-type="Editable" data-path="/content/vhhomecare/Home/jcr:content/left-par" tabindex="0" draggable="false" class="cq-Overlay cq-Overlay--component cq-Overlay--container is-disabled" title="Paragraph System - HTL [Root]" style="top: 224px; left: 8px; width: 1887px; height: 37px;"><span title="Paragraph System - HTL [Root]" class="cq-Overlay--component-name">Paragraph System - HTL [Root]</span><div data-type="Editable" data-path="/content/vhhomecare/Home/jcr:content/left-par/*" tabindex="0" draggable="false" data-text="Drag components here" title="Paragraph System - HTL [Root]" class="cq-Overlay cq-Overlay--component cq-droptarget cq-Overlay--placeholder is-selected is-active" style="top: 0px; left: 0px; width: 1887px; height: 0px;"></div>
Let me know what you guys think or if I'm even doing this the right way, thanks for your help.
-Brendan
