Opencart 3 – Own settings fields in the admin panel. Display fields on the site.


Sometimes on the site you need to display some additional data that is not in the admin panel. For example, add new phone numbers, add links to social networks, insert store hours in the right place, etc. You can set your own settings for this task. Let’s look at an example of adding our own custom field.


In file \admin\view\template\setting\setting.twig

in the right place we create a copy of the fax field, after

add own field:

where name config_val01 – new variable, where the data will be stored.

Next in file \admin\controller\setting\setting.php




Next, in the mysql database, we make a request:

where config_val01 – variable name, 77777 – test data, we’ll change them in the admin panel,


20477 – id settings fields in the admin panel, look at phpmyadmin table oc_settings, (1) – click double, sort from larger to smaller, look at the extreme id, as an example, before we added a new record, the extreme id was 20475, therefore, in the request we indicated 20477 (the main thing is that the number was greater than the extreme id, we could indicate both 20476 and 20478, 20479, etc.)



Go to the admin panel, update the modifiers and see new field:



This field can already be changed, edited and it is already saved in the database. It remains to display this field on the site.


In file \catalog\controller\common\header.php



Next, in file \catalog\view\theme\your_theme\template\common\header.twig

insert in the right place

if you need to insert a link to a phone number, use this entry so that when you link to the phone, crop characters: -, space, (,), etc.


Update the modificators and see the result on the site.



In order for the new fields to be placed in a separate tab in the admin panel, do the following:




further below, after the SERVER tab

insert new fields, I made 3 of them:

We update modifiers and as a result we receive a new tab:






Field with a text editor (textarea) + Radio buttons to enable / disable field output


as in the example above, add the name of the tab

Next, after block <div class=”tab-pane” id=”tab-server”> … </div>


Paste the code:

String <script src=”/admin/view/javascript/tinymce.min.js”></script> connects the text editor tinymce, you can download it at link.

(copy the entire contents of the archive to a folder /admin/view/javascript)


Further similarly as in the example above in the file\admin\controller\setting\setting.php insert the code

Next in files \catalog\controller\common\header.php and



As a result, we get such a block with settings



Please enter your comment!
Please enter your name here