Conditionally add tabs to page properties based on templates | Community
Skip to main content
A
akaria
Level 2
March 2, 2021
Solved

Conditionally add tabs to page properties based on templates

  • March 2, 2021
  • 4 replies
  • 3342 views

Hi everyone,

Is it possible to add customized tabs to page properties (in Sites console) based on templates?

  • We are currently modernizing 'old' static templates to 'new' editable templates
  • AEM version is 6.5.0
  • Using Touch UI

For example:

  • Create a new page named 'page1' with template 'A'
  • Create a new page named 'page2' with template 'B'
  • Create a new page named 'page3' with template 'C'
  • Page properties of 'page1' show customized tabs specific to template 'A', along with default tabs from the page component (basic, advanced, thumbnail, etc)
  • Page properties of 'page2' show only default tabs
  • Page properties of 'page3' show customized tabs specific to template 'C'

Is it possible to implement this?

 

If it's possible, where should we place the nodes for the customized tabs?
Do we need to create a certain template type for this?

Thanks in advance 🙂

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Suraj_Kamdi

Yes, we can @akaria .

1. create a template-specific component and provide resourceSuperType as the main page component. 

2. inside a template-specific component create separate page properties cq:dialog based on your requirement.

3. now next part go to the respective template structure inside /conf directory 

   ex. 

    a. /conf/<project-name>/settings/wcm/templates/sample-template/initial/jcr:content  and set resourceType as template specific component path 

   b. same applies for /conf/<project-name>/settings/wcm/templates/sample-template/structure/jcr:content.

 

Note: do not create any additional files inside template specific component other than page-properties dialog (cq:dialog)

 

Hope this will help.

 

Please let me know if you need more help on this.

 

 

4 replies

Vaibhavi_J
Vaibhavi_J
Level 7
March 2, 2021

Hi @akaria , 

It is possible with custom implementation with hide/show the tabs. But you need an identifier to choose while creating the page as it is a single template and page properties has to behave differently with page creation.  

One of the custom solution would be

1. Create a template with page property dialog has all the possible option. 

2. Customize the page creation widget where you provide an option to choose the behavior. (For ex: if you have 3 different behaviour for pageA B and C, provide some dropdown to choose the behavior while creating the page) 

3. Depending upon the value selected from step2(you can set the identifier based on values) hide the unwanted tabs and show the required once. 

 

Hope this helps

 

    Suraj_Kamdi
    Community Advisor
    Suraj_KamdiCommunity AdvisorAccepted solution
    Community Advisor
    March 2, 2021

    Yes, we can @akaria .

    1. create a template-specific component and provide resourceSuperType as the main page component. 

    2. inside a template-specific component create separate page properties cq:dialog based on your requirement.

    3. now next part go to the respective template structure inside /conf directory 

       ex. 

        a. /conf/<project-name>/settings/wcm/templates/sample-template/initial/jcr:content  and set resourceType as template specific component path 

       b. same applies for /conf/<project-name>/settings/wcm/templates/sample-template/structure/jcr:content.

     

    Note: do not create any additional files inside template specific component other than page-properties dialog (cq:dialog)

     

    Hope this will help.

     

    Please let me know if you need more help on this.

     

     

      A
      akariaAuthor
      Level 2
      March 4, 2021
      Hi @suraj_kamdi , I tried out your solution, and it worked! Thank you so much!! I might come back for further questions if you don't mind 🙂
      U
      Adobe Employee
      user05162Adobe Employee
      Adobe Employee
      March 2, 2021

      You can also look into Granite show/hide functionality that allows show/hide of content based on properties: https://experienceleague.adobe.com/docs/experience-manager-65/developing/components/hide-conditions.html?lang=en#overview

       

        S
        Subbu_WCM
        March 3, 2021

        Hi @akaria 

        you can use the granite render condition.

        <tab1> <items></items> <granite:rendercondition jcr:primaryType="nt:unstructured" sling:resourceType="<project>/components/graniteConditions/hide-tab" templates="[/conf/<project>/settings/wcm/templates/<template2>" /> </tab1> <tab2> <items></items> <granite:rendercondition jcr:primaryType="nt:unstructured" sling:resourceType="<project>/components/graniteConditions/hide-tab" templates="[/conf/<project>/settings/wcm/templates/<template1>" /> </tab2>



        in your project  create hide-tab.html (<project>/components/graniteConditions/hide-tab/hide-tab.html) and call sling modal with Sling request adaptable. In the sling modal you check the template of page is listed in the templates property or not.Based that you can set the render condition attribute for the request. You can get the page path from the request query string

         slingHttpServletRequest.setAttribute(RenderCondition.class.getName(), new SimpleRenderCondition(true/false));




          Terms & ConditionsAccessibility statement

          Loading footer...