How to Add Custom Entries To Admin System Configuration in Magento 2

Are you a Magento 2 developer that often tries his hands on developing extensions for custom functionalities? If so, you know how powerful is Magento 2’s admin configuration.

The custom module development may require to add custom entries to admin system configuration in Magento 2 under Stores > Configuration.

For example, creating custom dropdown or custom multi-select field as shown in the figure:

If you face a similar requirement, feel free to use the below solution:

Steps to add custom entries to admin system configuration in Magento 2:

1. Create system.xml file at Vendor/Extension/etc/adminhtml/
   
   <?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="vendor" translate="label" sortOrder="50">             <label><![CDATA[Vendor]]></label>         </tab>         <section id="vendor" translate="label" type="text" sortOrder="40" showInDefault="1" showInWebsite="1"                  showInStore="1">             <class>separator-top</class>             <label>Adding custom entries</label>             <tab>vendor</tab>             <resource>Vendor_Extension::config_extension</resource>             <group id="general" translate="label" type="text" sortOrder="20" showInDefault="1" showInWebsite="1"                    showInStore="1">                 <label>General Configuration</label>                 <field id="vendor_dropdown_custom" translate="label comment" type="select" sortOrder="30" showInDefault="1" showInWebsite="1" showInStore="1">                     <label>Vendor Custom Dropdown</label>                     <source_model>Vendor\Extension\Model\Config\Custom</source_model>                 </field>                 <field id="vendor_multiselect" translate="label comment" type="multiselect" sortOrder="40" showInDefault="1" showInWebsite="0" showInStore="1">                     <label>Multiselect</label>                     <source_model>Vendor\Extension\Model\Config\Multiselect</source_model>                 </field>             </group>         </section>     </system> </config>

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

   <?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="vendor" translate="label" sortOrder="50">             <label><![CDATA[Vendor]]></label>         </tab>         <section id="vendor" translate="label" type="text" sortOrder="40" showInDefault="1" showInWebsite="1"                  showInStore="1">             <class>separator-top</class>             <label>Adding custom entries</label>             <tab>vendor</tab>             <resource>Vendor_Extension::config_extension</resource>             <group id="general" translate="label" type="text" sortOrder="20" showInDefault="1" showInWebsite="1"                    showInStore="1">                 <label>General Configuration</label>                 <field id="vendor_dropdown_custom" translate="label comment" type="select" sortOrder="30" showInDefault="1" showInWebsite="1" showInStore="1">                     <label>Vendor Custom Dropdown</label>                     <source_model>Vendor\Extension\Model\Config\Custom</source_model>                 </field>                 <field id="vendor_multiselect" translate="label comment" type="multiselect" sortOrder="40" showInDefault="1" showInWebsite="0" showInStore="1">                     <label>Multiselect</label>                     <source_model>Vendor\Extension\Model\Config\Multiselect</source_model>                 </field>             </group>         </section>     </system> </config>

2. Create Custom.php file at Vendor/Extension/Model/Config/
   
   <?php namespace Vendor\Extension\Model\Config; class Custom implements \Magento\Framework\Option\ArrayInterface {     public function toOptionArray()     {         return [             ['value' => 0, 'label' => __('First')],             ['value' => 1, 'label' => __('Second')],             ['value' => 2, 'label' => __('Third')],             ['value' => 3, 'label' => __('Fourth')]         ];     } }

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

   <?php namespace Vendor\Extension\Model\Config;   class Custom implements \Magento\Framework\Option\ArrayInterface {     public function toOptionArray()     {         return [             ['value' => 0, 'label' => __('First')],             ['value' => 1, 'label' => __('Second')],             ['value' => 2, 'label' => __('Third')],             ['value' => 3, 'label' => __('Fourth')]         ];     } }

3. Create Multiselect.php file at Vendor/Extension/Model/Config/
   
   <?php namespace Vendor\Extension\Model\Config; class Multiselect implements \Magento\Framework\Option\ArrayInterface {     public function toOptionArray()     {         return [             ['value' => 0, 'label' => __('First')],             ['value' => 1, 'label' => __('Second')],             ['value' => 2, 'label' => __('Third')],             ['value' => 3, 'label' => __('Fourth')]         ];     } }

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

   <?php   namespace Vendor\Extension\Model\Config;   class Multiselect implements \Magento\Framework\Option\ArrayInterface {       public function toOptionArray()     {         return [             ['value' => 0, 'label' => __('First')],             ['value' => 1, 'label' => __('Second')],             ['value' => 2, 'label' => __('Third')],             ['value' => 3, 'label' => __('Fourth')]         ];     } }

That’s it to create the custom system.xml configuration in Magento 2.

Any doubts about creating custom system.xml configuration in your Magento 2 store can be mentioned in the Comments section below and I’d be happy to help!

Do share the solution with fellow developers via social media.

Thanks.