Categories: How ToMagento 2

How to Enable HTML tags in Backend Attributes in Magento 2

Considering the available CMS’s for eCommerce, Magento has still remained as the first pick for store owner whether it is small or large scale. Due to its flexible architecture, it allows us to customize the Magento according to our Business needs by extending the Native code. Magento backend is one of the fully powerful dashboards that enables store owner to manage everything without having knowledge of code. This Backend is made up of various configuration & attributes that determine how an attribute can be used in the frontend, it may be appearance, behavior or any operation. Even some of the backend attributes help store owner setting up customer convenience or guide them by placing notes in frontend.
Several times, it happens that having multiple payment or shipping method may confuse your customer at that time placing useful instructions using backend configuration helps a lot but you can only place textual instruction that means you cannot style text or place link. So at that time, you required to place HTML tags to add a link in the description.
So here is the small piece of code using which you can add HTML tags in backend attributes.
By default, Magento escapeHtml that renders the instructions for the payment methods. For that, we need to create a small extension that will override the getInstructions function.
Firstly, create “registration.php” file inside your extension folder using below code.

App\code\Vendor\Extension\registration.php

<pre class="lang:default decode:true">
<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
‘VENDOR_EXTENSION',
__DIR__
);
</pre>

After that we need to create one more “Module.xml” file at this path.
App\code\Vendor\Extension\etc\module.xml

<pre class="lang:default decode:true">
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
 <module name="VENDOR_EXTENSION" setup_version="1.0.0">
   </module>
</config>
</pre>

Now, we need to create “di.xml” file inside our extension frontend folder.
App\code\Vendor\Extension\etc\frontend\di.xml

<pre class="lang:default decode:true">
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <preference for="VENDOR\EXTENSION\Model\InstructionsConfigProvider" type="VENDOR\EXTENSION\Model\Rewrite\InstructionsConfigProvider" />
</config>
</pre>

In this final step, we need to create “InstructionsConfigProvider.php” at this path.
App\code\Vendor\Extension\Model\Rewrite\InstructionsConfigProvider.php

<pre class="lang:default decode:true">
<?php
namespace VENDOR\EXTENSION\Model\Rewrite;
class InstructionsConfigProvider extends \VENDOR\EXTENSION\Model\InstructionsConfigProvider
{
 public function getInstructions($code)
 {
     return nl2br($this->methods[$code]->getInstructions());// removed escapeHtml function!
 }
}
</pre>

That’s it you are done! You have successfully enable html tags in backend attributes. So, whenever you add any html tags it will automatically converted to hyperlink or respective format.

Let us know if you are facing an issue while implementing using this code by commenting below.

Happy Coding!

Click to rate this post!

[Total: 5 Average: 5]

Dhiren Vasoya

Dhiren Vasoya is a Director and Co-founder at MageComp, Passionate 🎖️ Certified Magento Developer👨‍💻. He has more than 9 years of experience in Magento Development and completed 850+ projects to solve the most important E-commerce challenges. He is fond❤️ of coding and if he is not busy developing then you can find him at the cricket ground, hitting boundaries.🏏

Next How to Recover Deleted Customers from Order details in Magento »

Previous « The Anatomy of a Winning Ecommerce Website that Can Skyrocket Your Online Sales

View Comments

Gert says:

January 28, 2021 at 4:09 am

Hi

Thanks for providing this information. I'm working on a Magento 2.4.1 staging site I've followed the instructions and first encountered a problem with ‘VENDOR_EXTENSION', in registration.php but changing the first single quote fixed that. I ran setup: upgrade without a problem but when I try to run di:compile I get the following error:

MiBPHP Fatal error: Class 'AttTags\AttTags\Model\InstructionsConfigProvider' not found in /home/**/domains/**.co.za/public_html/**/app/code/AttTags/AttTags/Model/Rewrite/InstructionsConfigProvider.php on line 5

I double-checked all the files and everything is as you instructed. I would appreciate your help.

Thanks