Back to Top

How to create note field in system.xml Magento 2

Updated 30 March 2023

Here, we will explain how to add note type field in system.xml file in magento 2. Additionally, we will explain how to show module package version with this note type field.

The system.xml file allows you to manage the Commerce system configuration. For detailed information about the system.xml file, you can also check the magento blog by clicking on

The system.xml file is located under etc/adminhtml/system.xml in a given Commerce 2 extension.

Field type reference

<field>-Tag can have one of the several allowed values for the type="" attribute:

It is also possible to create a custom field type. This is often done when a special button, with an action, is required. To do this requires two main elements:

Searching for an experienced
Magento 2 Company ?
Find out More
  • Creating a block in the adminhtml area
  • Setting the type="" to the path to this block

Steps to add note type field in system.xml

Here, we will explain only for the note type field. Let’s start the work. Please check our blog to know more how to add custom module  configuration in Magento2.

  • First, create system.xml file.
    File Path: app/code/Webkul/Custom/etc/adminhtml/system.xml
<?xml version="1.0"?>
<config xmlns:xsi="" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
        <tab id="webkul" translate="label" sortOrder="10">
        <section id="test" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">
            <label>Test Configuration</label>
            <group id="custom_product_information" translate="label" type="text" sortOrder="700" showInDefault="1"
                showInWebsite="1" showInStore="1">
                <label>Custom module Product Information</label>
                <field id="author" translate="label" type="note" sortOrder="1" showInDefault="1" showInWebsite="1"
  • Now, create ModuleInfo.php block file.
    File Path: app/code/Webkul/Custom/Block/Adminhtml/System/Config/ModuleInfo.php

namespace Webkul\Custom\Block\Adminhtml\System\Config;

use Magento\Backend\Block\Context;
use Magento\Framework\Module\PackageInfoFactory;

class ModuleInfo extends \Magento\Config\Block\System\Config\Form\Field\Heading
     * @var PackageInfoFactory
    protected $packageInfoFactory;

     * Constructor
     * @param Context $context
     * @param PackageInfoFactory $packageInfoFactory
     * @param array $data
    public function __construct(
        Context $context,
        PackageInfoFactory $packageInfoFactory,
        array $data = []
    ) {
        $this->packageInfoFactory = $packageInfoFactory;
        parent::__construct($context, $data);

     * Render element html
     * @param \Magento\Framework\Data\Form\Element\AbstractElement $element
     * @return string
    public function render(\Magento\Framework\Data\Form\Element\AbstractElement $element)
        $label = $element->getLabel();

        $info = "<p>You can add any text/html here.</p>";
        $label .= $info;

        $packageInfo = $this->packageInfoFactory->create();
        $version = $packageInfo->getVersion('Webkul_Custom');
        $label .= '<p>'.__('Version: %1', $version).'</p>';

        return sprintf(
            '<tr class="system-fieldset-sub-head" id="row_%s"><td colspan="5"><h4 id="%s">%s</h4></td></tr>',

Now, It will be shown in the System configurations as below:


Related blogs

You can also check our other wonderful blogs related to the system configurations in magento2 with the following links:
1. How to create a checkbox field in system configuration Magento 2: Click here
2. How to create a Button in the Configuration Section in Magento 2: Click here
3. How to Create Radio button in Admin System Configuration in Magento 2: Click here
4. Create a dependent field in admin configuration in Magento 2: Click here

Moreover, If you are looking to create a custom e-commerce website, it is a great idea to hire Magento developers who can help you build a powerful and scalable online store.

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*

Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home