InsideAEM Limited: Expert knowledge for Adobe Experience Manager and Adobe Marketing Cloud Expert knowledge for Adobe Experience Manager and Adobe Marketing Cloud

Have a Question?

Start typing below to have an answer about Adobe Experience Manager!

How to extend the Welcome Page Menu and the Top Navigation Menu…

In this post I would like to explain how you can add additional menu entries to the AEM welcome page and top navigation menu. The welcome page is the one you see after you’ve logged in to AEM. It looks like this:

AEM Welcome Page

AEM Welcome Page

The Top Navigation Menu is the one you see for example on the top of the Siteadmin and it looks like this:

AEM Top Navigation

AEM Top Navigation

To extend those areas with a new icon you should add a new node under /apps/<my_app>/<my_icon> with the following properties:

Name Value Description
jcr:primaryType nt:unstructured or cq:Widget The primary node type. You can use cq:Widget if you want to use this node to display the content for your app. You will also need to add the properties defined in the post how to display a custom widget (xtype) in a page.
jcr:mixinTypes cq:Console This is important. This is what is searched for by AEM to find configuration for the welcome page and top navigation menu
consoleDescription The description for your entry
consoleTitle The title for your entry
historyLink A link to populate the history section. See /libs/wcm/core/content/siteadmin for example
historyResourceTypes Resource types for the history section entries
historyShow Whether to show or hide history.
Note: Displaying history impacts how fast the welcome page is loaded
historyTitle The title for the history section
iconClass The class to be used for your entry. You can use this class to customize the icon displayed in the top navigation menu
sling:vanityPath The vanitypath under which this path will be available

Here is a sample configuration written to display our recorder functionality.

Configuration Recorder for welcome page

 

So the welcome page now looks like this:

Welcome page with recorder icon

And the top navigation looks like this:

Top menu with recorder icon

The source code is available as part of our InsideAEM recorder application here: https://github.com/insideaem/recorder

 

 

The following two tabs change content below.

Nono Junang

Technical Director at InsideAEM Limited
I’m a certified Adobe Experience Manager 6 Lead Developer with experience of full project development life cycle from analysis, design, implementation, testing to final delivery. I come along with excellent communication skills as well as extensive experience with multicultural fellows from India, USA, Africa, Europe and Asia Pacific. I speak English, German and French fluently.

One Comment

  1. Pingback: Customizing the CQ5 Welcome Page | Terra Beata

Leave a Reply

You must be logged in to post a comment.