Customizing Site Properties | Community
Skip to main content
margaretywong5
Level 2
March 14, 2018
Solved

Customizing Site Properties

  • March 14, 2018
  • 5 replies
  • 2771 views

Can someone point me to documentation on how to customize any of the site properties tabs? Screenshot of the page I am trying to customize is attached.

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 Vijayalakshmi_S

Hi,

If the requirement is to create new tab for page properties, then we have to go for overriding instead of overlaying. Below is the steps for the same.

  • Create a new component  -> Delete the JSP that is automatically created.
  • To the newly created component node -> add sling:resourceSuperType with value as "/libs/wcm/foundation/components/page"
  • Create Touch UI dialog structure for the newly created component (same as is in "libs" till this node - /cq:dialog/content/items/tabs/items)
  • Add node(granite/ui/components/foundation/section) for your new tab.
  • Create template with resourceType being the component that you have created as above and hence the page out of it. -> You would see the new tab coming up on Page properties and while creating page.
  • If you don't want this new tab to show up while creating page, add property named "cq:showOnCreate" (Boolean type set to false) - You can see this property for tabs other than "Basic" and "Advanced" which alone will show up while creating new page.

Screenshot for reference: (wcmpage-override is component inheriting from wcm/foundation/components/page)

Page created out of templates(with wcmpage-override) will pick this new tab along with entire logic/files/nodes from wcm/foundation/components/page.

5 replies

Vijayalakshmi_S
Level 10
March 15, 2018

HI,

Above properties of page is nothing but the dialog of page component.  To customise, we need to overlay the same.

  • Check for the resourceSuperType property of the page component that you are using for your project.
  • Projects created out of maven archetype will have superType to be wcm/foundation/components/page.
  • Navigate to that resource(/libs/wcm/foundation/components/page/cq:dialog), you will find these tabs which is again including the properties from foundation/components/page/cq:dialog.

With this above flow, we need to ultimately overlay the path /libs/foundation/components/page/cq:dialog to /apps/foundation/components/page/cq:dialog and do the customisations here.

We need not change any reference anywhere in the flow, because the paths are mentioned without "libs". Per the "Resource Resolver Factory" configuration, apps will be checked first.

Screenshot for reference:

margaretywong5
Level 2
March 22, 2018

Thank you for pointing me in the right direction vijis31358935.

What if I just want to add a new tab, can I do that without copying everything from /libs/foundation/components/page/cq:dialog to /apps/foundation/components/page/cq:dialog? When I create just one new tab under "/apps/foundation/components/page/cq:dialog", it doesn't show the default tabs from "/libs/foundation/components/page/cq:dialog" unless I copy the default tabs into "/apps/foundation/components/page/cq:dialog"

Vijayalakshmi_S
Vijayalakshmi_SAccepted solution
Level 10
March 22, 2018

Hi,

If the requirement is to create new tab for page properties, then we have to go for overriding instead of overlaying. Below is the steps for the same.

  • Create a new component  -> Delete the JSP that is automatically created.
  • To the newly created component node -> add sling:resourceSuperType with value as "/libs/wcm/foundation/components/page"
  • Create Touch UI dialog structure for the newly created component (same as is in "libs" till this node - /cq:dialog/content/items/tabs/items)
  • Add node(granite/ui/components/foundation/section) for your new tab.
  • Create template with resourceType being the component that you have created as above and hence the page out of it. -> You would see the new tab coming up on Page properties and while creating page.
  • If you don't want this new tab to show up while creating page, add property named "cq:showOnCreate" (Boolean type set to false) - You can see this property for tabs other than "Basic" and "Advanced" which alone will show up while creating new page.

Screenshot for reference: (wcmpage-override is component inheriting from wcm/foundation/components/page)

Page created out of templates(with wcmpage-override) will pick this new tab along with entire logic/files/nodes from wcm/foundation/components/page.

margaretywong5
Level 2
March 22, 2018

Thank you!

Adobe Employee
March 22, 2018

[1] should be good starter to understand how you can extend this. Hope this helps

[1] : Extending Page Properties in AEM Sites