How can I render plain text as HTML in a template? I've run into a wall trying to render a SVG image markup code into html from a plain text field.
I'm looking to render the SVG code from a plain text field without overriding the plain text field rendering everywhere else.
plain text format currently converts all HTML tags and &lt;&gt; to &amp;lt; &amp;gt;.
I created a field template and tried both outputting the field content as
{{ item.content.context.value }}

and
{{ item.content|raw }}

both render the value as string wrapping every line with &quot;quotation marks&quot; and converting line-breaks into &lt;br/&gt; tags.
I previously had the field type formatted text, but that also wrapped everything in &lt;pre&gt; tags, even when all tags were allowed. I'd really like to get it working with plain text.
Example of the svg-code the field has to hold in text form:
&lt;svg version=&quot;1.1&quot; id=&quot;Layer_1&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; xmlns:xlink=&quot;http://www.w3.org/1999/xlink&quot; x=&quot;0px&quot; y=&quot;0px&quot;
         viewBox=&quot;0 0 290 290&quot; enable-background=&quot;new 0 0 290 290&quot; xml:space=&quot;preserve&quot;&gt;
    &lt;g&gt;
        &lt;path fill=&quot;none&quot; stroke=&quot;#78C681&quot; stroke-width=&quot;3&quot; stroke-miterlimit=&quot;10&quot; d=&quot;M261.1,273.1H28.9c-6.6,0-12-5.4-12-12V28.9
            c0-6.6,5.4-12,12-12h232.1c6.6,0,12,5.4,12,12v232.1C273.1,267.7,267.7,273.1,261.1,273.1z&quot;/&gt;
        &lt;circle fill=&quot;none&quot; stroke=&quot;#1B435D&quot; stroke-width=&quot;2&quot; stroke-miterlimit=&quot;10&quot; cx=&quot;145.2&quot; cy=&quot;166.9&quot; r=&quot;62.7&quot;/&gt;
        &lt;line fill=&quot;none&quot; stroke=&quot;#78C681&quot; stroke-width=&quot;3&quot; stroke-miterlimit=&quot;10&quot; x1=&quot;16.9&quot; y1=&quot;60.8&quot; x2=&quot;273.1&quot; y2=&quot;60.8&quot;/&gt;
        &lt;circle fill=&quot;none&quot; stroke=&quot;#1B435D&quot; stroke-width=&quot;2&quot; stroke-miterlimit=&quot;10&quot; cx=&quot;178.3&quot; cy=&quot;152.3&quot; r=&quot;6.8&quot;/&gt;
        &lt;path fill=&quot;none&quot; stroke=&quot;#1B435D&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-miterlimit=&quot;10&quot; d=&quot;M115.1,167.9
            c8.8,0,22.3,3.2,28.4,4.7&quot;/&gt;
        &lt;path fill=&quot;none&quot; stroke=&quot;#1B435D&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-miterlimit=&quot;10&quot; d=&quot;M151.9,216.9
            c0,0,17.2-1.5,29.6-14.8&quot;/&gt;
    &lt;/g&gt;
&lt;/svg&gt;
A solution by iworkyon from the Drupal community:
field--node--[field name].html.twig:
{% if svg %}
  &lt;div class=&quot;my-svg&quot;&gt;
    {{ svg|raw }}
  &lt;/div&gt;
{% endif %}

MYTHEME.theme:
/**
* Implements hook_preprocess_field().
*/
function MYTHEME_preprocess_field(&amp;$variables, $hook) {
    switch ($variables['element']['#field_name']) {
      case 'field_svg_test':
        $variables['svg'] = $variables['items'][0]['content']['#context']['value'];
        break;
    }
}