Adobe Experience Manager Sites & More

srinivas_chann1 · 3/26/20

Hi,

In order to view edit the contents for multiple tab to add components under parsys of multiple tabs that requires that section of the page to be clicked, the author must:

switch to preview mode
click on the tab or accordion where the content is to be authored to view the parsys
switch to edit mode
This can be very time consuming especially since the page refreshes and defaults to the first tab or closes the accordion after authoring some components.

Observations:-

Whenever the author needs to edit the page , edit mode is selected and authoring activities are performed.

During this edit mode , the click functionalities / user interactions on the actual links will be blocked by an overlay in touch UI enabling only authoring activities in components.

Here the issue mentioned is - when multiple tabs are present the author is having no choice but to go to preview mode in order to navigate to tab2 then again needed to move to edit mode to do authoring tasks,
which is the only way in touch UI whereas the classic UI enables the user interaction in edit mode as well.

Could some provide inputs as how to resolve this issue and just using only edit mode

Thanks

Theo_Pendle · 3/26/20

Hello,

This issue is common for older components that were created back in 6.1. Since then, things have changed and a number of newer best-practices help to make components much more user-friendly to edit and configure for authors.

The problem here is that you do not have any javascript that can be triggered from the Editor overlay to change the selected tab. You could write this yourself by:

Creating a clientlib which swiiches tabs
Adding it to the edit dialog by using the extraClientlibs - String[] property on the cq:dialog node

But the easiest thing to do (and the most future-proof) would be to update your Tabs component. I suggest you migrate towards AEM Core Components - Tabs which already has a tab-switching feature in Edit mode:

View solution in original post

Theo_Pendle · 3/26/20

Hello,

This issue is common for older components that were created back in 6.1. Since then, things have changed and a number of newer best-practices help to make components much more user-friendly to edit and configure for authors.

The problem here is that you do not have any javascript that can be triggered from the Editor overlay to change the selected tab. You could write this yourself by:

Creating a clientlib which swiiches tabs
Adding it to the edit dialog by using the extraClientlibs - String[] property on the cq:dialog node

But the easiest thing to do (and the most future-proof) would be to update your Tabs component. I suggest you migrate towards AEM Core Components - Tabs which already has a tab-switching feature in Edit mode:

srinivas_chann1 · 3/27/20

Thanks for your inputs.

It get me insights as how this could be solved. In case you have sample code / links for this could you post ,that will be really helpful for me in solving this.

Thanks

Theo_Pendle · 3/27/20

You can download AEM Core Components from here: https://github.com/adobe/aem-core-wcm-components/releases

Theo_Pendle · 3/27/20

You can then proxy those components to use them in your site: https://docs.adobe.com/content/help/en/experience-manager-core-components/using/get-started/using.ht...

Theo_Pendle · 3/27/20

More on the Proxy pattern here: https://docs.adobe.com/content/help/en/experience-manager-core-components/using/developing/guideline...

srinivas_chann1 · 3/30/20

Hi,

It seems to much of content is available, not sure where to start . I am using AEM (6.3.3.5) so Should i install core.wcm.components.all-2.8.0.zip and should i change the cq_dialog of component i am using or should i change *.html files of the component

Thanks

Theo_Pendle · 3/30/20

It sounds like you are a beginner, there are many things to learn. I suggest you start with this tutorial: https://docs.adobe.com/content/help/en/experience-manager-learn/getting-started-wknd-tutorial-develo...