How to customize the page properties Dialog to include dynamic DropDownList in AEM/CQ5
This post will explain the details to customize page properties Dialog in both Touch and Classic UI's, the version used for implementing this is Adobe Experience Manager(AEM) 6.1.The basic page properties dialog will be displayed if the sling:resourceSuperType of the page rendering component is specified as foundation page component(wcm/foundation/components/page for Sightly and foundation/components/page for JSP)
Steps to customize the basic page properties and including dynamic DropDownList to the dialog.
/apps/training/components/page-content/ will be referred as the page rendering component path in the post.
Classic UI:
Copy /libs/foundation/components/page/dialog to /apps/training/components/page-content/Rename the new node to required name e.g. custom
Copy /libs/foundation/components/page/tab_basic to /apps/training/components/page-content/
Rename /apps/training/components/page-content/tab_basic to required name e.g tab_custom
Remove all the nodes under /apps/training/components/page-content/tab_custom/items
Change path value in the node /apps/training/components/page-content/dialog/items/tabs/items/custom to /apps/training/components/page-content/tab_custom.infinity.json
Change title property of the node /apps/training/components/page-content/tab_custom to required value e.g Custom
Save All configurations
Open the page from site Admin(e.g. http://localhost:4502/cf#/content/training-site/en.html), now the new tab(Custom) will be added to the page properties with empty panel
