{"id":29640,"date":"2026-04-10T13:00:59","date_gmt":"2026-04-10T11:00:59","guid":{"rendered":"https:\/\/aivie.ch\/faq\/comment-puis-je-utiliser-du-html-dans-des-variables-twig\/"},"modified":"2026-04-10T13:01:22","modified_gmt":"2026-04-10T11:01:22","slug":"comment-puis-je-utiliser-du-html-dans-des-variables-twig","status":"publish","type":"faq","link":"https:\/\/aivie.ch\/fr\/faq\/comment-puis-je-utiliser-du-html-dans-des-variables-twig\/","title":{"rendered":"Comment puis-je utiliser du HTML dans des variables TWIG ?"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Vous pouvez utiliser du HTML dans les variables TWIG, mais vous devez l\u2019autoriser explicitement avec le filtre <code>safe_html<\/code>. Cela permet de garantir la s\u00e9curit\u00e9. <\/p>\n\n<!--more-->\n\n<h2 class=\"wp-block-heading\">Pourquoi le HTML ne fonctionne-t-il pas directement dans TWIG ?<\/h2>\n\n<p class=\"wp-block-paragraph\">Aivie a renforc\u00e9 les mesures de s\u00e9curit\u00e9 et le traitement du HTML dans les variables TWIG a donc \u00e9t\u00e9 restreint. La raison en est que le HTML non contr\u00f4l\u00e9 peut repr\u00e9senter un risque de s\u00e9curit\u00e9, par exemple via du JavaScript int\u00e9gr\u00e9 ou des contenus externes. <\/p>\n\n<p class=\"wp-block-paragraph\">Par cons\u00e9quent, les r\u00e8gles suivantes s\u2019appliquent d\u00e9sormais :<\/p>\n\n<ul class=\"wp-block-list\">\n<li>Les fonctions telles que <code>|raw<\/code> ne sont plus autoris\u00e9es<\/li>\n\n\n\n<li>Pas de balises HTML directes via des jetons<\/li>\n\n\n\n<li>Uniquement une sortie s\u00e9curis\u00e9e et contr\u00f4l\u00e9e via les fonctions TWIG autoris\u00e9es<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\">Solution : utilisez le filtre <code>safe_html<\/code><\/h2>\n\n<p class=\"wp-block-paragraph\">Pour continuer \u00e0 utiliser le HTML, un nouveau filtre TWIG est disponible : <code>safe_html<\/code>.<\/p>\n\n<p class=\"wp-block-paragraph\">Ce filtre autorise une liste d\u00e9finie de balises HTML s\u00e9curis\u00e9es. Cela vous permet de continuer \u00e0 utiliser des contenus structur\u00e9s tels que des tableaux, des mises en forme ou des mises en page simples. <\/p>\n\n<p class=\"wp-block-paragraph\">Sont interdits, par exemple :<\/p>\n\n<ul class=\"wp-block-list\">\n<li>JavaScript<\/li>\n\n\n\n<li>iFrames<\/li>\n\n\n\n<li>Images<\/li>\n\n\n\n<li>Contenus externes pr\u00e9sentant un risque potentiel<\/li>\n<\/ul>\n\n<p class=\"wp-block-paragraph\">Les \u00e9l\u00e9ments HTML autoris\u00e9s sont bas\u00e9s sur la liste officielle du d\u00e9sinfecteur (<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/HTML_Sanitizer_API\" target=\"_blank\" rel=\"noreferrer noopener\">MDN HTML Sanitizer API)<\/a>.<\/p>\n\n<h2 class=\"wp-block-heading\">Exemple<\/h2>\n\n<p class=\"wp-block-paragraph\">Voici comment afficher correctement du HTML dans une variable TWIG :<\/p>\n\n<pre class=\"wp-block-code\"><code>&lt;td valign=\"top\" style=\"width: 100%\"&gt;\n  {{ item.name | safe_html }}\n&lt;\/td&gt;\n<\/code><\/pre>\n\n<p class=\"wp-block-paragraph\">Important : le filtre doit \u00eatre appliqu\u00e9 partout o\u00f9 du HTML est attendu.<\/p>\n\n<h2 class=\"wp-block-heading\">Quelles sont les am\u00e9liorations suppl\u00e9mentaires ?<\/h2>\n\n<ul class=\"wp-block-list\">\n<li>Visualisation et \u00e9dition directes de TWIG dans l\u2019\u00e9diteur d\u2019e-mails, de pages de destination et de contenus dynamiques<\/li>\n\n\n\n<li>L\u2019\u00e9diteur de code de l\u2019<a href=\"https:\/\/aivie.ch\/fr\/?attachment_id=26509\" data-type=\"product\" data-id=\"25135\">Aivie Builder<\/a> prend d\u00e9sormais en charge TWIG de mani\u00e8re native (Linting, Type Ahead, formatage, extraits)<\/li>\n\n\n\n<li>Aper\u00e7u am\u00e9lior\u00e9 des contenus TWIG<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n<p class=\"wp-block-paragraph\">Les balises HTML sont possibles dans TWIG, mais uniquement de mani\u00e8re contr\u00f4l\u00e9e via le filtre <code>safe_html<\/code>. Vous combinez ainsi flexibilit\u00e9 et s\u00e9curit\u00e9 tout en \u00e9vitant les risques li\u00e9s \u00e0 un code non s\u00e9curis\u00e9. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Vous pouvez utiliser du HTML dans les variables TWIG, mais vous devez l\u2019autoriser explicitement avec le filtre safe_html. Cela permet de garantir la s\u00e9curit\u00e9.<\/p>\n","protected":false},"featured_media":0,"template":"","categories":[],"tags":[1731,1748,1747,1728,1727],"FaqCategories":[521,1043],"FaqTags":[1743,1744],"class_list":["post-29640","faq","type-faq","status-publish","hentry","tag-code","tag-constructeur-de-mails","tag-constructeur-de-pages-de-destination","tag-html","tag-twig","FaqCategories-e-mails-fr","FaqCategories-page-de-renvoi","FaqTags-code","FaqTags-twig"],"acf":[],"featured_image_urls_v2":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","post-thumbnail":"","aiv_480w":"","woocommerce_thumbnail":"","woocommerce_single":"","woocommerce_gallery_thumbnail":""},"post_excerpt_stackable_v2":"<p>Vous pouvez utiliser du HTML dans les variables TWIG, mais vous devez l\u2019autoriser explicitement avec le filtre safe_html. Cela permet de garantir la s\u00e9curit\u00e9. Pourquoi le HTML ne fonctionne-t-il pas directement dans TWIG ? Aivie a renforc\u00e9 les mesures de s\u00e9curit\u00e9 et le traitement du HTML dans les variables TWIG a donc \u00e9t\u00e9 restreint. La raison en est que le HTML non contr\u00f4l\u00e9 peut repr\u00e9senter un risque de s\u00e9curit\u00e9, par exemple via du JavaScript int\u00e9gr\u00e9 ou des contenus externes. Par cons\u00e9quent, les r\u00e8gles suivantes s\u2019appliquent d\u00e9sormais : Les fonctions telles que |raw ne sont plus autoris\u00e9es Pas de balises HTML\u2026<\/p>\n","category_list_v2":"Non class\u00e9","author_info_v2":{"name":"","url":""},"comments_num_v2":"0 commentaire","_links":{"self":[{"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/faq\/29640","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/faq"}],"about":[{"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/types\/faq"}],"version-history":[{"count":1,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/faq\/29640\/revisions"}],"predecessor-version":[{"id":29641,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/faq\/29640\/revisions\/29641"}],"wp:attachment":[{"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/media?parent=29640"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/categories?post=29640"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/tags?post=29640"},{"taxonomy":"FaqCategories","embeddable":true,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/FaqCategories?post=29640"},{"taxonomy":"FaqTags","embeddable":true,"href":"https:\/\/aivie.ch\/fr\/wp-json\/wp\/v2\/FaqTags?post=29640"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}