Removal of auto generated wrapping div tag around the components in AEM 6.4

[ashpawartmg]

Hi Everyone,

I tried removal of wrapping div around the components in AEM 6.4 using these options below , but it did not work either in edit mode or preview mode.

Requirement : It should be removed on both the publisher as well as author/edit mode.

Author mode should also work properly and I should be able to edit the components.

I am using HTL and NOT JSP.

Options tried :

• Using <div ... data-sly-unwrap="${wcmmode.disabled}" ></div> to remove additional div in non edit mode. --> Doesn't work for edit mode. Cannot edit the component anymore.
• Tried adding getRequest().setAttribute(ComponentContext.BYPASS_COMPONENT_HANDLING_ON_INCLUDE_ATTRIBUTE, false); code in activate method of java class extending WcmUse class --> But this removed the wrapping div for all components added on the page except the first component.
• Explicitly tell AEM not to wrap the component using cq:noDecoration. --> Doesn't work for edit mode. Cannot edit the component anymore.

• Create cq:htmlTag node as nt:unstructured, create property cq:tagName and leave it blank. --> Doesn't work for edit mode. Cannot edit the component anymore.

Please help on this matter.

Thanks.

[arunpatidar · Accepted solution]

Hi,

Wrapper div is needed for Authoring components, you can swaitch to another HTML element except div e.g. section, article if thats serve your purpose.

You can remove though from publihser

[Prince_Shivhare]

@ashpawartmg 

I had this issue earlier, but in my case, div tags were creating additional space even if it a test condition.

so I removed the <div> tags and used only <sly> where ever I can use.

the options which you are tried didn't work for me as well.

[markus_bulla_adobe]

Hi @ashpawartmg!

As @arunpatidar already pointed out, it is not possible to remove the auto-generated DIV tags while keeping the ability to edit components.

AEMs authoring user interfaces takes the additional DIVs to inject editing capabilities and UI elements and allows you to edit components. While it is possible to change the decoration tags to another HTML tag, there is no way to do both: remove the decoration tags altogether and being able to edit the page/components.

It's totally possible - and you've already listed various ways to do so - to remove decoration tags on the publish side. But you will need to keep them on the authoring side.

Hope that helps!