Close

Aikau Menus Extension Point

The main menu of Share is implemented with the new Aikau UI development framework. It is possible to customize this menu, so you can navigate to new custom pages for example.

Architecture Information: Share Architecture

Description

The main menu and title in Share is implemented in Aikau, it looks like this:

dev-extensions-share-main-menu

Adding and removing menu items from the menu is a common task. To do this we use a Surf Extension Module. It will look something like this:

<extension>
  <modules>
    <module>
      <id>Add custom menu item to header</id>
      <version>1.0</version>
      <auto-deploy>true</auto-deploy>  
      <customizations>
        <customization>
          <targetPackageRoot>org.alfresco.share.header</targetPackageRoot>
          <sourcePackageRoot>com.example.header</sourcePackageRoot>
        </customization>
      </customizations>
    </module>
  </modules>
</extension>   

So we are targeting the /share/WEB-INF/classes/alfresco/site-webscripts/org/alfresco/share/header/share-header.get.js web script controller file, which implements the menu JSON model. Now, if we want to for example add a menu item we need to create a file with the same name and put it in alfresco/web-extension/site-webscripts/com/example/header. The file will look like this:

var headerMenu = widgetUtils.findObject(model.jsonModel, "id", "HEADER_APP_MENU_BAR");
if (headerMenu != null) {
    headerMenu.config.widgets.push({
        id: "HEADER_CUSTOM_PROFILE_LINK",
        name: "alfresco/menus/AlfMenuBarItem",
            config: {
                label: "My profile",
                targetUrl: "user/" + encodeURIComponent(user.name) + "/profile"
            }
    });
}   

This is all that is required to extend an existing JSON model. We’re using widgetUtils to find the HEADER_APP_MENU_BAR widget. Once we have it, we simply push a widget into it.

Deployment - App Server

  • tomcat/shared/classes/alfresco/web-extension/site-webscripts - put the files that are overriding here
  • tomcat/shared/classes/alfresco/web-extension/site-data/extensions - put the Extension Module here.

(Untouched by re-deployments and upgrades)

Deployment All-in-One SDK project

  • aio/share-jar/src/main/resources/alfresco/web-extension/site-webscripts - put the files that are overriding here
  • aio/share-jar/src/main/resources/alfresco/web-extension/site-data/extensions - put the Extension Module here.

More Information

Tutorials

Developer Blogs

Edit this page

Suggest an edit on GitHub
This website uses cookies in order to offer you the most relevant information. Please accept cookies for optimal performance. This documentation is subject to the Documentation Notice.