Magento 2 - HTML on the tag Comment in the custom module

Question

How to add html on the tag comment in my module like this image?

Answer 1

You can use CDATA tag like this code below:

File: code/[Package]/[Module]/etc/adminhtml/system.xml

<field id="pattern" translate="label comment" type="text" sortOrder="3" showInDefault="1" showInWebsite="1" showInStore="1">
    <label>Gift code pattern</label>       
    <comment><![CDATA[Generate gift codes for Gift Card products. For example:<br/><strong>[A.8] : 8 alpha<br/>[N.4] : 4 numeric<br/>[AN.6] : 6 alphanumeric<br/>GIFT-[A.4]-[AN.6] : GIFT-ADFA-12NF0O</strong>]]></comment>
</field>

Answer 2

Also, if you need an html tag to be displayed as plain text in comment - replace < with < and > with >

E.g.:

<comment><![CDATA[Some comment with tag as plain text - &lt;rating&gt;4.3&lt;/rating&gt;]]></comment>

The above will be displayed as

Some comment with tag as plain text - <rating>4.3</rating>

Answer 3

I have used HTML in my code using < and > and it is working fine. No <!CDATA> required for this

Sample code:

<comment>
    &lt;strong&gt;Heading:&lt;/strong&gt; &lt;br&gt;
    Text line one here &lt;br&gt;
    Text line two here &lt;br&gt;
    Text line three here
</comment>