Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

create a tab

dhiraj85
Level 2
Level 2

Hi friends

                i have a requirement to create tab in AEM, i saw all the component in design but not got,,so can you please suggest me how to create a tab component in AEM, i have tabs component in /apps/weretail/components/content/tabs but i dont know how to use that,,i am new in AEM,,can u please help me

dhiraj85_0-1592029565815.png

 

 

Thanks 

 

1 Accepted Solution
kautuk_sahni
Correct answer by
Community Manager
Community Manager

Answer by @Nirmal_Jose 

 

Adobe core component 'tab' [1] has got some very good features like highlight tab on load, nest tab etc. In case you want an enhanced user experience on top of this functionality, overlay this component to style the presentation. 

In one of my projects, we had done multiple enhancements like icon, better hover effect etc

[1] - https://aemcomponents.dev/content/core-components-examples/library/container/tabs.html

View solution in original post

7 Replies
surabhikatiyar
Employee
Employee

There is an OOTB Tab component. The location of the OOTB component in the repository is 

 

/apps/weretail/components/content/tabs

 

surabhikatiyar_1-1591897367570.png

 

 

 

Shashi_Mulugu
Community Advisor
Community Advisor

You can extend Core components created by Adobe which is production ready, easily configurable with all latest features

https://docs.adobe.com/content/help/en/experience-manager-core-components/using/components/tabs.html

 

vanegi
Employee
Employee

You can download the demo component package (tab-component-1

-0.zip) from https://helpx.adobe.com/experience-manager/using/htl_tab_component.html and deploy using package manager.

dhiraj85
Level 2
Level 2

yes..i am getting this..but this is not complete,

Nirmal_Jose
Community Advisor
Community Advisor

Adobe core component 'tab' [1] has got some very good features like highlight tab on load, nest tab etc. In case you want an enhanced user experience on top of this functionality, overlay this component to style the presentation. 

In one of my projects, we had done multiple enhancements like icon, better hover effect etc

[1] - https://aemcomponents.dev/content/core-components-examples/library/container/tabs.html

kautuk_sahni
Correct answer by
Community Manager
Community Manager

Answer by @Nirmal_Jose 

 

Adobe core component 'tab' [1] has got some very good features like highlight tab on load, nest tab etc. In case you want an enhanced user experience on top of this functionality, overlay this component to style the presentation. 

In one of my projects, we had done multiple enhancements like icon, better hover effect etc

[1] - https://aemcomponents.dev/content/core-components-examples/library/container/tabs.html

View solution in original post

dhiraj85
Level 2
Level 2
@surabhikatiyar hi,,can u please tell me whole process,,i am new in AEM,,so please help me