Get Free Audit

Renderer in Mаgentо 2.0

May 7, 2015

4141 Mishel Soiko

Renderer in Mаgentо 2.0

Let’s take a look at a few cases when it may be required to add a custom element. The main place is the admin panel. We might require the following elements:

  1. A column in a Grid;
  2. A form element;
  3. Config element as described in the system.xml file.

1. Grid

There are 2 ways to implement depending on how the column list is generated.

– Via xml

The column itself will be rendered by the standard block:

The collection will be generated via our resource:

It is also possible to modify the filter of our custom column.

Column values will be rendered by our Block:

It is also possible to monitor and change not the column Abstract itself, but one of the already created external elements. For example:




Here you will find all the ready-to-use basic templates.


– inside of the block

The render is a full match to the previous one.


2. Form

It is all simple here. The field can be declared as any type. You just need to replace the render block as follows:

Now let’s take a look at the structure of the render field:


Vlad Yunusov
Partner With Us Let's discuss how to grow your business. Get a Free Quote.
Talk to Vlad

It is possible either to process HTML inside the render function here or to replace the default template by adding the variable $_template with our template.

Besides the Abstract element we can also inherit and modify such elements as:




Controller and Model allow you to change the process of saving the custom field, for which this form has been generated. But there is nothing unusual here, so, let’s move on.


3. System.xml

3 class types can be set in the Config section:

– frontend_model – this block controls the frontend;

– backend_model – this model manages reading and saving;

– sourse_model – this model is used for fields that have a fixed number of values, described here.

Of course, it is possible to not indicate each of the 3 classes, it depends on what exactly we are going to modify. Or we can indicate one of the default options, as described in the case with the sоurсe_mоdel: Magento\Config\Model\Config\Source\Yesno


– frontend_model

It is possible to customize one of the ready-made elements. For example:





– backend_model

While customizing one of the standard elements we inherit one of the models here:

Magento\Config\Model\Config\Backend\ . . .


– source_model

This is, perhaps, the most popular type of customization: to define your own selection options for settings.

Vlad Yunusov
Partner With Us Looking for a partner that will help you to grow your business? We are the right company to develop your webstore. Feel free to get in touch with us. We will be happy to discuss your business opportunities and provide you with a Free Quote. Talk to Vlad

Post a new comment

BelVG Newsletter
Subscribe to our mailing list and get interesting stuff and updates to your email inbox.
Email *