Need custom title in content tree instead of component name when child-editor is used in component authoring dialog.

[gajanank2729265]

Hi All,

We have one use case where we are using the child editor in the container component same way as "/apps/core/wcm/components/carousel/v1/carousel" is using.

• When we open the dialog for the component, we get option to add child components in the container component in items tab.
• after selecting one of the components from the list we can see the text field with the place holder name same as name of the component we selected.
• if we overwrite this title, we get the property saved as cq:panelTitle in the node structure. but we need this same value to be there in the content tree instead of the component name.

Is there any way to fetch authored value (saved in the cq:panelTitle) in the content tree ?

In the screenshot above, I have added the breadcrumb and Layout Container in the multi-field and overridden the titles of component which we want in the content tree.

Please let me know if we have any solution to achieve this.

Thanks and Regards,

Gajanan

[BrianKasingli · Accepted solution]

Hi @gajanank2729265,

It looks like how the editor.ContentTab is rendered by from AEM's core.js client library. This client library lives in /libs, so it appears like there is AEM no configuration that you can configure to display custom values based on your requirements.

Take a look at:
Configuration of the contentTab: /libs/wcm/core/content/editor/jcr:content/sidepanels/edit/items/tabs/items/contentTab
cq.authoring.editor.core logic: /libs/cq/gui/components/authoring/editors/clientlibs/core/js/ui/ui.ContentTree.js

This is how I would implement this new feature, if really required:

1. Utilise the Sling Resource Merge to merge in additional configuration under /apps/wcm/core/content/editor/jcr:content/sidepanels/edit/items/tabs/items/contentTab
2. Create a new clientlibrary with categories of "cq.authoring.editor.core".
3. Implement my own version of /libs/cq/gui/components/authoring/editors/clientlibs/core/js/ui/ui.ContentTree.js, using the "granite:class" set in the contentTab node itself; ensuring that JavaScript will run when this class exists on the page. 

I hope this helps.

However, you will be overwriting AEM's default behaviour. Maybe in the next AEM updates, your changes will be incompatible.