34. Creating Complex navigation component using javascript helper in AEM

Creating Complex navigation component using javascript helper in AEM(Javascript Use-Api): This video shows how to create a complex navigation component in AEM using javascript helper.

Navigation is a horizontal menu at the top of the page that provides links to navigate to a specific page in the site.

Having navigation feature is very common in the website, therefore creating navigation component is important task you can do as a aem developer.

Typicall, the top navigation is the same on all pages. But in simple navigation it was changing on every page and display no items when the pagge has no children.

We will use data-sly-use and data-sly-repeat attributes to build up it's logic. You can refer below url to find the code :

https://github.com/pankajchhatri/AEM

We are using Javascript Use-API in this video.

Use-API has some common variables available right off the bat.
currentNode
currentPage
resource
log
sling
pageProperties
properties
pageManager
component
designer
currentDesign
currentStyle

Using currentPage object we are calling getAbsoluteParent() method to build up our logic.

After doing it open the English page, navigation will appear there. Every page will show the same navigation items now even if the page has no children item.

share, support, like and subscribe
Subscribe : https://www.youtube.com/channel/UC5Lc...
LinkedIn : https://www.linkedin.com/in/pankaj-ch...
Facebook : https://www.facebook.com/pankajchhatri
Twitter : https://twitter.com/pankajchhatri
Google plus : https://plus.google.com/u/0/+pankajch...

About : AEM/CQ5 tutorial is a youtube channel which helps you to learn AEM concepts theoretically as well as practically.