web-dev-qa-db-fra.com

Rendre le texte brut en HTML dans Drupal 8 twig

J'ai rencontré un mur essayant de rendre un code de balisage d'image svg en html à partir d'un champ de texte brut.

Je cherche à rendre le code svg à partir d'un champ de texte brut sans remplacer le rendu du champ de texte brut partout ailleurs.

le format de texte brut convertit actuellement toutes les balises html et <> en &lt; &gt;.

J'ai créé un modèle de champ et essayé à la fois de sortir le contenu du champ comme

{{ item.content.context.value }}

et

{{ item.content|raw }}

les deux rendent la valeur sous forme de chaîne, enveloppant chaque ligne avec des "guillemets" et convertissant les sauts de ligne en <br/> Mots clés.

J'avais auparavant le texte formaté du type de champ, mais qui a également tout enveloppé dans <pre> tags, même lorsque tous les tags étaient autorisés. J'aimerais vraiment le faire fonctionner avec du texte brut.

Exemple de code svg que le champ doit contenir sous forme de texte:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
         viewBox="0 0 290 290" enable-background="new 0 0 290 290" xml:space="preserve">
    <g>
        <path fill="none" stroke="#78C681" stroke-width="3" stroke-miterlimit="10" d="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"/>
        <circle fill="none" stroke="#1B435D" stroke-width="2" stroke-miterlimit="10" cx="145.2" cy="166.9" r="62.7"/>
        <line fill="none" stroke="#78C681" stroke-width="3" stroke-miterlimit="10" x1="16.9" y1="60.8" x2="273.1" y2="60.8"/>
        <circle fill="none" stroke="#1B435D" stroke-width="2" stroke-miterlimit="10" cx="178.3" cy="152.3" r="6.8"/>
        <path fill="none" stroke="#1B435D" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M115.1,167.9
            c8.8,0,22.3,3.2,28.4,4.7"/>
        <path fill="none" stroke="#1B435D" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M151.9,216.9
            c0,0,17.2-1.5,29.6-14.8"/>
    </g>
</svg>

J'espère que quelqu'un pourra vous aider.

Meilleur,

Alari

8theming
15
Alari Truuts

Une solution de iworkyon de la communauté Drupal:

champ - nœud - [nom du champ] .html.twig:

{% if svg %}
  <div class="my-svg">
    {{ svg|raw }}
  </div>
{% endif %}

THEME.info:

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

Cela a fonctionné pour moi:

{{ item.content['#context'].value|raw }}
8
Janey

Avez-vous essayé d'appliquer le filtre brut sur la valeur?

{{ item.content.context.value|raw }}

Mais ce n'est pas sûr. Pour sortir des fichiers, vous pouvez utiliser un champ de fichier. Cela a les bons formateurs de champ pour générer le lien. Si vous n'êtes pas en mesure de configurer le lien dans l'interface utilisateur selon vos besoins, vous pouvez modifier le twig ou prétraiter pour ce champ spécifique.

8
4k4