Level 2

Solved

Hide AEM page tabs for specific page templates

Forum|Forum|8 months ago
April 29, 2025
4 replies
1562 views

Hi, our content authoring team would like to hide the following unused AEM page tabs for specific page templates.
Cloud Services
Permissions
Preview
Progressive Web App

Can you please recommend the best approach to accomplish this for AEM as a cloud service?
Also, please let me know if there is any risk in removing these tabs.

Will it break any existing functionality? If no, will this customization be impacted by future upgrades to the product?

Thanks!

Best answer by SantoshSai

@viavu

Preview Tab Can’t Be Hidden

Preview Tab is Injected Dynamically by the Editor Framework
The "Preview" tab isn't a typical child node under /libs or /apps like other page properties tabs. Instead, it's dynamically injected by the Page Editor Shell based on the editor context in AEMaaCS. That’s why:
- It doesn’t appear in /libs/wcm/foundation/components/page/cq:dialog/... or similar places.
- It’s not controlled by sling:hideChildren.
Cloud-Specific feature
In AEMaaCS, the preview tab is part of the authoring experience enhancements provided by Adobe. It supports preview URLs that integrate with externalized domains (like preview publishers). This feature is tightly coupled with AEMaaCS environments and not present in the same way on local SDKs.
Cannot be hidden via sling:hideChildren
Since it's not a child resource under the dialog node (i.e., not a node like tabs/preview), sling:hideChildren doesn't affect it. The tab is rendered based on editor config metadata or runtime context, not statically defined dialogs.
Why you can hide other tabs but not preview
Tabs like cloudservices, blueprint, and livecopy exist as JCR nodes, so hiding them with sling:hideChildren works. Since Preview is UI-generated, it bypasses this mechanism.

SantoshSai

Community Advisor

Hi @viavu,

Recommended Approach to Hide Tabs for specific page templates, use the editable templates framework and override the page properties dialog only under the template structure - this ensures the changes apply only to selected templates and are safe for upgrades.

You can also use a granite:rendercondition if you want to conditionally hide a tab rather than delete it. (Optional)

Will It break existing functionality?

No, it will not break existing functionality as long as:

Your implementation does not rely on the removed tabs programmatically.
Features like Cloud Services config, Permissions, or PWA support are not actively being used.

Will it be impacted by future AEMaaCS upgrades?

No, if you:

Avoid overlaying /libs dialogs
Make changes under /conf within the editable template structure

Adobe explicitly supports customizing cq:dialog under /conf for editable templates. This is considered an upgrade-safe and best practice approach.

General considerations before removal

Check if any custom workflows or scripts depend on the data in these tabs (e.g., inherited cloud config paths).
Ensure no components read page-level properties set via these tabs.
If you're unsure about full usage, consider hiding the tab conditionally (e.g., using granite:rendercondition) rather than fully removing it.

Hope that helps!

Santosh Sai

V

ViaVuAuthor

Level 2

Hi Santosh Sai,

Based on your suggestion, I would like to use the granite:rendercondition to conditionally hide unused AEM tabs.

Can you please point me to any online document that has sample implementation of hiding AEM tabs such as "Cloud Services" and/or "Progressive Web App" etc using granite:rendercondition?

Thank you!

SantoshSai

Community Advisor

@viavu

To conditionally display or hide tabs in the Page Properties dialog based on the page template, follow these steps:

Overlay the Dialog: Navigate to your editable template's structure and overlay the cq:dialog node if it doesn't already exist. This is typically located at:
/conf/<your-site>/settings/wcm/templates/<your-template>/structure/jcr:content/cq:dialog
Identify the Tab to Hide: Within the dialog, locate the tab you wish to conditionally hide (e.g., cloudservices, pwa)
Add granite:rendercondition: Under the tab node, add a granite:rendercondition node to specify the condition under which the tab should be displayed.

Example: Hiding the "Cloud Services" tab for specific templates

Here's how you might configure the granite:rendercondition to hide the "Cloud Services" tab for templates other than /conf/my-site/settings/wcm/templates/landing-page:

<cloudservices
    jcr:primaryType="nt:unstructured"
    jcr:title="Cloud Services"
    sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
    <granite:rendercondition
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/renderconditions/simple"
        expression="${requestPathInfo.suffix == '/conf/my-site/settings/wcm/templates/landing-page'}"/>
    <!-- Tab contents go here -->
</cloudservices>

In this example, the "Cloud Services" tab will only be displayed when the page being edited uses the specified template.

For more detailed guidance and examples, consider the following resources:

Santosh Sai

aanchal-sikka

Community Advisor

@viavu

Option:-1:

You could also control it by defining multiple page components.

Each page component has its own cq:dialog. You can show or hide resources (Tabs) in this dialog. https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/developing/full-stack/sling-resource-merger#properties

Option-2: Control Tabs via Page policy

- Define properties in Design Mode of dialog where you configure which tabs to show or hide.

- On template, configure policy of the page component to show/hide

- Use these configs, to show/hide tabs

Notice Step-5 & 6 on https://kiransg.com/2023/11/05/accessing-component-policies-in-aem-at-the-component-dialog-level/

Aanchal Sikka

V

ViaVuAuthor

Level 2

@aanchal-sikka Not sure if this is applicable to AEMaaCS but I don't see /apps/core/wcm/components/....

Somehow I don't see core folder under my /apps folder in the CRXDE

However, thank you for your post.

aanchal-sikka

Community Advisor

@viavu

We shouldn't be editing /apps/core/wcm/components/. I had just shared a snapshot from 6.5 for understanding.

You would need to extend the component in apps directory of your project. And then add configs to it for show/hide etc.

Please check once, you might already be extending page component in project-specific /apps directory

Aanchal Sikka

AmitVishwakarma

Community Advisor

Hi @viavu ,

Recommended & Upgrade-Safe Approach: Use granite:rendercondition

This lets you conditionally show/hide tabs in the Page Properties dialog based on template path without deleting or overlaying product code.

1.Go to your template's structure dialog:

/conf/your-site/settings/wcm/templates/<template-name>/structure/jcr:content/cq:dialog

2. Find the tab node to hide, like:

<cloudservices
    jcr:primaryType="nt:unstructured"
    jcr:title="Cloud Services"
    sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">

3. Add this under the tab node:

<granite:rendercondition
    jcr:primaryType="nt:unstructured"
    sling:resourceType="granite/ui/components/coral/foundation/renderconditions/simple"
    expression="${requestPathInfo.suffix == '/conf/your-site/settings/wcm/templates/landing-page'}"/>

Replace the template path as needed.

Regards,
Amit

V

ViaVuAuthor

Level 2

@amitvishwakarma do you think it would work without a service or servlet implementation as suggested in this blog?

M

MatthewDa19

Level 2

@viavu LOL No way - his all answers are copy pasted from ChatGpt!

aanchal-sikka

Community Advisor

@viavu Did you find the suggestions helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!

Aanchal Sikka

V

ViaVuAuthor

Level 2

@aanchal-sikka After doing some research, I was fortunate to find a doc that was referring to

sling:hideChildren. After trying this configuration, it worked for hiding the tabs that I was trying to hide for specific page templates, except for preview on AEMaaCS environments. The same works fine on my local. The preview tab on AEMaaCS sets a preview URL and probably cannot be hidden. Not sure about the mystery behind why "preview" tab alone cannot be hidden in the cloud environment. I tried trouble shooting using the Developer Console / Repository Browser, however, I could not locate where the "preview" tab is coming from. I searched under libs, apps and config paths and could not locate "preview" tab. I could locate other tabs such as "cloudservices", "blueprint" and "livecopy" but not "preview". If anyone can shed some insight into the mystery behind why "preview" tab cannot be hidden in AEMaaCS environment, that would be nice to know. Thank you!

SantoshSai

Accepted solution

Community Advisor

@viavu

Preview Tab Can’t Be Hidden

Preview Tab is Injected Dynamically by the Editor Framework
The "Preview" tab isn't a typical child node under /libs or /apps like other page properties tabs. Instead, it's dynamically injected by the Page Editor Shell based on the editor context in AEMaaCS. That’s why:
- It doesn’t appear in /libs/wcm/foundation/components/page/cq:dialog/... or similar places.
- It’s not controlled by sling:hideChildren.
Cloud-Specific feature
In AEMaaCS, the preview tab is part of the authoring experience enhancements provided by Adobe. It supports preview URLs that integrate with externalized domains (like preview publishers). This feature is tightly coupled with AEMaaCS environments and not present in the same way on local SDKs.
Cannot be hidden via sling:hideChildren
Since it's not a child resource under the dialog node (i.e., not a node like tabs/preview), sling:hideChildren doesn't affect it. The tab is rendered based on editor config metadata or runtime context, not statically defined dialogs.
Why you can hide other tabs but not preview
Tabs like cloudservices, blueprint, and livecopy exist as JCR nodes, so hiding them with sling:hideChildren works. Since Preview is UI-generated, it bypasses this mechanism.

Santosh Sai

Will It break existing functionality?

Will it be impacted by future AEMaaCS upgrades?

General considerations before removal

Example: Hiding the "Cloud Services" tab for specific templates

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded