I create a custom page that opens through "editor.html". I want to hide the panelheader (global-bar). Are there any ways to do this?
The following doc can help you with that:
If you would like to remove the complete pane, Just remove the editor.html from the URL and it should do it.
But if you want to customize the panel, you need to overlay one of the files under "/libs/cq/gui/components/authoring/editorpanel" and customize as per you business requirement.
Hi, can I just ask why you would want to do this?
In any case, here is the answer:
JaideepBrar's answer could work but if overlay these files you will be affecting all editors (for AEM Sites pages, but also in the template editor for example). If this is your aim, then the simplest way is to overlay /libs/cq/gui/components/authoring/editorpanel/editorpanel.jsp and remove the following line (line 37 on AEM 6.5.1, but it may be different for you on an older version):
<sling:include replaceSelectors="panelcontent"/>
If however you want to make make the header disappear for the AEM Sites editor only, then you will have to go a little further.
Hope this helps Here is the result when I follow those steps and refresh my editor page:
Hey.
I'm trying to remove this panel due to the fact that we have a requirement to configure nodes through a page that will be located in the content. Therefore, when editing the panel appears, the end user should not see this panel. So there was an option to use the JavaScript or redirect (url without editor.html) or just remove the panel. I found the files "editorpanel.jsp" in which the panel is added, but when "<sling:include replaceSelectors="panelcontent"/>" is deleted, it also affects other parts of the program which isn't permissible. At the moment, I settled on this option:
<%@ page session="false" import="com.adobe.granite.ui.components.AttrBuilder, com.adobe.granite.ui.components.Config" %>
<%@ page import="com.adobe.granite.ui.components.rendercondition.RenderCondition,
com.adobe.granite.ui.components.rendercondition.SimpleRenderCondition,
com.day.cq.wcm.api.NameConstants,
org.apache.sling.api.resource.Resource,
org.apache.commons.lang.StringUtils,
org.apache.sling.api.resource.ValueMap,
org.apache.sling.api.resource.Resource,
com.adobe.granite.ui.components.ComponentHelper" %>
<%@ include file="/libs/granite/ui/global.jsp" %>
<%
Config cfg = new Config(resource);
AttrBuilder attrs = new AttrBuilder(request, xssAPI);
attrs.add("id", cfg.get("id", String.class));
attrs.addClass("editor-panel");
if (cfg.get("default", Boolean.FALSE)) {
attrs.addClass("editor-panel-active");
}
attrs.addClass(cfg.get("class", String.class));
attrs.addOthers(cfg.getProperties(), "class", "id", "default");
String suffix = slingRequest.getRequestPathInfo().getSuffix();
if (!StringUtils.isEmpty(suffix)) {
Resource contentResource = resourceResolver.resolve(suffix);
if (contentResource != null) {
if (NameConstants.NT_PAGE.equals(contentResource.getResourceType())) {
Resource pageResource = resource.getResourceResolver().getResource(contentResource.getPath() + "/jcr:content");
if (pageResource != null) {
String pageType = pageResource.getValueMap().get("pageType", String.class);
if (StringUtils.isNotEmpty(pageType) && pageType.equals("configuration")) {
%>
<div <%= attrs.build() %>>
<sling:include replaceSelectors="panelcontent"/>
</div>
<%
} else {
%>
<div <%= attrs.build() %>>
<sling:include replaceSelectors="panelheader"/>
<sling:include replaceSelectors="panelcontent"/>
</div>
<%
}
}
} else {
%>
<div <%= attrs.build() %>>
<sling:include replaceSelectors="panelheader"/>
<sling:include replaceSelectors="panelcontent"/>
</div>
<%
}
}
}
%>
But I'm not sure it's correct.
Oops! It's a copy-paste error on my part!
The line to delete is:
<sling:include replaceSelectors="panelheader"/>
Yes, sorry. I deleted <sling:include replaceSelectors="panelheader"/>
You may write CSS to hide the global header and adjust the content panel.
Add in your author site CSS file, to not impact other sites.
.editor-GlobalBar.js-editor-PanelHeader.editor-panel-header{
display:none;
}
.editor-panel-content.editor-panel-content-with-header{
top:0px;
}
Use important if CSS is overridden by another CSS rule.