How to display string that contains HTML in twig template?

Question

How can I display a string that contains HTML tags in a twig template?

My PHP variable contains this HTML and text:

$word = '<b> a word </b>';

When I do this in my twig template:

{{ word }}

I get this:

<b> a word <b>

I want this instead:

<b> a word </b>

Is it possible to get this easily?

Overtake

I won't add this as an answer, but an alternative approach for people reaching this question is to store values in Markdown, like StackOverflow does. Then you could create a Twig filter with automatic escaping, since you can trust the HTML to be safe. No raw needed, and your stored values are human readable! – Wheelchair

Answer 1

Use raw keyword, https://twig.symfony.com/doc/3.x/api.html#escaper-extension

{{ word | raw }}

Broomrape

When doing a replace it is not working for me. {{ word | replace( {(word_to_replace) : '<b>' ~ (word_to_replace) ~ '</b>' }) | raw }} Any idea? – Repose

UPDATE: I solved it by adding it to another variable using 'set', then {{ word | raw }} works fine. – Repose

Answer 2

You can also use:

{{ word|striptags('<b>')|raw }}

so that only <b> tag will be allowed.

Rayford

I'd say this version is preferable if you want to allow only a few tags. – Parity

How do you allow multiple tags? – Assist

Answer 3

{{ word|striptags('<b>,<a>,<pre>')|raw }}

if you want to allow multiple tags

Blockhead

Answer 4

if you don't need variable, you can define text in
translations/messages.en.yaml :
CiteExampleHtmlCode: "<b> my static text </b>"

then use it with twig:
templates/about/index.html.twig
… {{ 'CiteExampleHtmlCode' }}
or if you need multilangages like me:
… {{ 'CiteExampleHtmlCode' | trans }}

Let's have a look of https://symfony.com/doc/current/translation.html for more information about translations use.

Sleet

Answer 5

Worked for me only with "render" before striptags:

node--mycontenttype.html.twig:

{{ content.field_my_field|render|striptags }}

Thumbscrew