Magento Tutorials

Add Custom Links to Magento 2 Admin Menu

Create a menu item in Magento 2 Admin

To view a module’s page, we need a way to navigate to it in Magento 2 Admin Panel. In this guide, you’ll learn how to create a link to the page in the left navigation and tells Magento how to resolve requests for that page.

Step 1: Register and name the custom menu item

1. In the module’s root directory, create the file

registration.php

This file registers the module

MyCompany_ExampleAdminNewPage

with Magento.

File content for registration.php:

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'MyCompany_ExampleAdminNewPage',
    __DIR__
);

2. In the module’s root directory, create a new directory called etc. Under that directory, create the file module.xml. This file specifies the name and setup version of this module.

etc/module.xml

File content for module.xml:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="MyCompany_ExampleAdminNewPage" setup_version="1.0.0"></module>
</config>

Step 2: Create a new menu item in the left navigation

1. Under the created etc directory, create a new directory called adminhtml. Under that directory, create the file menu.xml. This XML file adds new menu items to the Magento admin.

etc/adminhtml/menu.xml

The menu.xml file provided below adds two items in the Content section of the left navigation:

  • A new separate section with the title Greetings under Content.
  • A link with the label Hello World that leads to a page request for exampleadminnewpage/helloworld/index underneath that new section.
Custom menu Magento 2 Admin

The following parts make up the generated page request link to the Hello World page:

  • exampleadminnewpage – This is the frontName. Because its purpose is to help route requests to the correct module, we give it the same name as the module, but this is not required.
  • helloworld – This specifies the name of the controller to use.
  • index – In the XML file, since the action for the controller is not specified, Magento uses the default value index.

File content for menu.xml

<config xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”urn:magento:module:Magento_Backend:etc/menu.xsd”>
    <menu>
        <add id=”MyCompany_ExampleAdminNewPage::greetings” title=”Greetings” translate=”title” module=”MyCompany_ExampleAdminNewPage” parent=”Magento_Backend::content” sortOrder=”50″ dependsOnModule=”MyCompany_ExampleAdminNewPage” resource=”MyCompany_ExampleAdminNewPage::greetings”/>
        <add id=”MyCompany_ExampleAdminNewPage::greetings_helloworld” title=”Hello World” translate=”title” module=”MyCompany_ExampleAdminNewPage” parent=”MyCompany_ExampleAdminNewPage::greetings” sortOrder=”10″ dependsOnModule=”MyCompany_ExampleAdminNewPage” action=”exampleadminnewpage/helloworld” resource=”MyCompany_ExampleAdminNewPage::greetings”/>
    </menu>
</config>

2. Under etc/adminhtml create the file routes.xml. The contents of this XML file tells Magento to route requests that use the frontName exampleadminnewpage to this module.

etc/adminhtml/routes.xml
 

File content for routes.xml

<?xml version="1.0"?>
<config
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="admin">
        <route id="exampleadminnewpage" frontName="exampleadminnewpage">
            <module name="MyCompany_ExampleAdminNewPage"/>
        </route>
    </router>
</config>