


rachanam1547401
rachanam1547401
18-04-2019
Hi,
I was trying to remove wrapper div on components for a specific page types using following code.
getRequest().setAttribute(ComponentContext.BYPASS_COMPONENT_HANDLING_ON_INCLUDE_ATTRIBUTE, false);
It does remove the wrapper div but it also remove edit functionality on components. My requirement is to preserve edit functionality and remove wrapper div as well in both author and publish mode.
Anyone has any idea on how to achieve this or it's not possible because the reason for wrapper div is to enable editing on the same page?
Thanks & Regards,
Rachna
Arun_Patidar
MVP
Arun_Patidar
MVP
18-04-2019
Hi,
Wrapper div allow editing in author mode, so if you want editing then you should't remove wrapper div from author.
Though you can place another custom tag
e.g.
AEM Developer Learning : Useful Properties of a Component in AEM 6.3
Ravi_Pampana
MVP
Ravi_Pampana
MVP
18-04-2019
Hi,
Try <div ... data-sly-unwrap="${wcmmode.disabled}" ></div> to remove additional div in non edit mode.
you can try using cq:htmlTag node in your component to generate your custom div with custom class.
cq:tagName
smacdonald2008
smacdonald2008
18-04-2019
As Arun suggests - removing that wrapper DIV in author will remove the ability for an author to make changes to a component.
WHy do you want to remove this DIV thereby removing author the ability to make changes to the component in the AEM Author server?
rachanam1547401
rachanam1547401
18-04-2019
Hi All,
Thanks for your replies.
We want to remove wrapping div in author because it breaks the grid layout and will require extra css to fix it. We also don't want to stop edit functionality of the component.
Thanks
Arun_Patidar
MVP
Arun_Patidar
MVP
18-04-2019
Hi,
It is not possible to remove wrapper div without stopping edit functionality.
But you can write author edit mode specific CSS to fix grid layout in author.
e.g.
You can inject extra class for author mode and handle grid without impacting on other modes:
<div data-sly-test.author="${wcmmode.edit || wcmmode.design}" data-sly-unwrap></div>
<div class="row ${author ? author_row : '' }">
//
//
</div>
you can write extra css for author_row in order to fix grid
smacdonald2008
smacdonald2008
18-04-2019
What grid are you referring to? DO you mean AEM Responsive grig?
rachanam1547401
rachanam1547401
23-04-2019
Hi Both,
Thank you for your help. We are going to use Arun's solution to fix grid in author mode.
Also, we are using custom grid and not AEM responsive grid.
Regarding unwrapping div in publish mode, I couldn't use <div ... data-sly-unwrap="${wcmmode.disabled}" ></div> because we are adding parsys and dropping components in parsys. I have to use getRequest().setAttribute(ComponentContext.BYPASS_COMPONENT_HANDLING_ON_INCLUDE_ATTRIBUTE, false); Basically I wrote a class extending WcmUse class and added above code in activate method of it. Called the class from the specific renderer and it worked for all components on that page, and all pages using that renderer will not have wrapper div in publish mode.
Thanks,
Rachna