When we create a model or extension, then its control should be given in the admin configuration by using the system XML file, this is a better model and extension scale, which decides how better the model or extension that you have created is.
In Magento 2 there is one file that is System.xml that is used to create admin configuration fields.
This file we need when we want to provide some setting option inside of the admin configuration for admin users.
Store > Setting > Configuration
Step 1: Register Extension
In order to create a menu in Magento 2 extension first, you have to create a registration.php file inside of the module folder.
Wishusucess/Conf/registration.php
<?php /** * @Category Wishusucess * @Package Wishusucess_Conf * @website http://www.wishusucess.com/ */ \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::MODULE, 'Wishusucess_Conf', __DIR__ );
Step 2: Module information and Version
The module XML file consists of the basic information of your extension. This is one of the most basic files of the Magento 2 extension.
In the Wishusucess module’s root directory, I have created a new directory that is called the, etc directory. So here I have created a file that is module.xml file under the etc directory.
Wishusucess/Conf/etc/module.xml
<?xml version="1.0"?> <!-- /** * @Category Wishusucess * @Package Wishusucess_Conf * @website http://www.wishusucess.com/ */ --> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Wishusucess_Conf" setup_version="2.1.0" /> </config>
Read more: Magento 2.4 Installation Guide: How to Install Magento 2.4.2
Step 3: Create Adminhtml Menu XML File
To Create Admin Menu in Magento 2 extension we need to create the menu XML file.
This is the file about the routing and navigation of the items.
By using this link we can navigate to the other page. These files are used to create a link that helps to the landing on another page that is added in the left navigation and tells Magento framework how to resolve requests for that page.
The menu.xml file gives us options to add items in the content section of the left navigation.
Each item we use to add by action attribute and that action can be decided by the Magento 2 developers, where they want to redirect after clicking the link.
Wishusucess/Conf/etc/adminhtml/menu.xml
<?xml version="1.0"?> <!-- /** * @Category Wishusucess * @Package Wishusucess_Conf * @website http://www.wishusucess.com/ */ --> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Backend:etc/menu.xsd"> <menu> <add id="Wishusucess_Conf::conf" title="Wishusucess" translate="title" module="Wishusucess_Conf" sortOrder="20" resource="Wishusucess_Conf::conf"/> </menu> </config>
Add Menu Items in Magento 2 Extension
Now, we can add the menu item from the other module to another module or
We can add the menu item in the same file of
Wishusucess/Conf/etc/adminhtml/menu.xml
But here,
I am adding the menu item from another module. So I am creating a menu file
Wishusucess/Recaptcha/etc/adminhtml/menu.xml
<?xml version="1.0"?> <!-- /** * Tech9logy * @category Recaptcha * @package Wishusucess_Recaptcha */ --> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../Magento/Backend/etc/menu.xsd"> <menu> <add id="Wishusucess_Recaptcha::view" title="Google reCaptcha" translate="title" module="Wishusucess_Recaptcha" sortOrder="10" resource="Wishusucess_Recaptcha::view"/> <add id="Wishusucess_Recaptcha::grid" title="reCAPTCHA Configuration" module="Wishusucess_Recaptcha" sortOrder="20" parent="Wishusucess_Recaptcha::view" action="adminhtml/system_config/edit/section/wishusucess/" resource="Wishusucess_Recaptcha::view"/> </menu> </config>
After executing the setup upgrade command you will see the output like the below image.
Steps to Create Admin Configuration By System XML File
We have to create a file inside of etc/adminhtml/system.xml then we can
Step 2: Set default value
Step 3: Flush Magento cache
Step 4: Get value from the configuration
Magento 2 System XML File for Admin Configuration
The System configuration page is logically divided into four parts:
- Tabs
- Sections
- Groups
- Fields.
Now if you will see the admin you can see the menu item which I have added here,
Now, adding system XML file and linking the Recaptcha configuration with system configuration via menu item link.
Wishusucess/Recaptcha/etc/adminhtml/system.xml
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd"> <system> <tab id="recaptcha" translate="label" sortOrder="10"> <label>Wishusucess</label> </tab> <section id="wishusucess_recaptcha" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1"> <class>separator-top</class> <label>reCAPTCHA Setting</label> <tab>recaptcha</tab> <resource>Wishusucess_Recaptcha::wishusucess_recaptcha</resource> <group id="general" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="0" showInStore="0"> <label>reCAPTCHA Configuration</label> <field id="enabled" translate="label comment" type="select" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1" canRestore="1"> <label>Enabled</label> <source_model>Magento\Config\Model\Config\Source\Yesno</source_model> </field> <field id="googlesitekey" translate="label comment" type="text" sortOrder="2" showInDefault="1" showInWebsite="1" showInStore="1" canRestore="1"> <label>Site Key</label> <comment><![CDATA[Enter Site Key]]></comment> </field> <field id="googlesecretkey" translate="label comment" type="text" sortOrder="3" showInDefault="1" showInWebsite="1" showInStore="1" canRestore="1"> <label>Secret Key</label> <comment><![CDATA[Enter Secret Key]]></comment> </field> <field id="moduleposition" translate="Module" type="multiselect" sortOrder="4" showInDefault="1" showInWebsite="1" showInStore="1"> <label>Select Form</label> <source_model>Wishusucess\Recaptcha\Model\Config\Source\ConfigOption</source_model> </field> </group> </section> </system> </config>
Now the output will look like the below image.
So this is the simple way to add the menu item and system XML configurations in the module and extension.
Similar Posts: