{"ArticleId":null,"Name":"The HTML editor and allowed HTML","Content":"\n\u003Cp\u003EDescriptions, pages, blog posts, news, knowledgebase articles and many settings are edited with the admin \u003Cstrong\u003EHTML editor\u003C/strong\u003E. It writes HTML for you, and you can switch to the source view to write or paste HTML directly. Everything you save is checked against a list of allowed HTML, which keeps scripts and hidden forms out of your store.\u003C/p\u003E\n\n\u003Ch2 id=\u0022editor\u0022\u003EUsing the editor\u003C/h2\u003E\n\u003Cul\u003E\n\u003Cli\u003EThe toolbar has paragraph styles, bold, italic, underline, colours, lists, alignment, tables, links, pictures and video, and a code view (\u003Ccode\u003E\u0026lt;/\u0026gt;\u003C/code\u003E) for the raw HTML.\u003C/li\u003E\n\u003Cli\u003EPictures are uploaded with the picture button or the file manager, and inserted with their address.\u003C/li\u003E\n\u003Cli\u003EPaste from Word or Google Docs through the plain-text paste or clean up in code view: pasted formatting brings a lot of unnecessary markup.\u003C/li\u003E\n\u003C/ul\u003E\n\n\u003Ch2 id=\u0022allowed\u0022\u003EWhat HTML is allowed\u003C/h2\u003E\n\u003Cp\u003EWhen you save, GrandNode checks the HTML against an allowlist:\u003C/p\u003E\n\u003Cul\u003E\n\u003Cli\u003E\u003Cstrong\u003EAllowed\u003C/strong\u003E: text and layout markup - headings, paragraphs, lists, tables, links, images, figures, blockquotes, code, \u003Ccode\u003Ediv\u003C/code\u003E and \u003Ccode\u003Espan\u003C/code\u003E - with classes and ordinary attributes.\u003C/li\u003E\n\u003Cli\u003E\u003Cstrong\u003ENot allowed\u003C/strong\u003E: \u003Ccode\u003E\u0026lt;script\u0026gt;\u003C/code\u003E, event attributes such as \u003Ccode\u003Eonclick\u003C/code\u003E, \u003Ccode\u003Ejavascript:\u003C/code\u003E links, and interactive elements that collect input - \u003Ccode\u003Eform\u003C/code\u003E, \u003Ccode\u003Einput\u003C/code\u003E, \u003Ccode\u003Ebutton\u003C/code\u003E, \u003Ccode\u003Eselect\u003C/code\u003E, \u003Ccode\u003Etextarea\u003C/code\u003E and similar.\u003C/li\u003E\n\u003Cli\u003E\u003Cstrong\u003EEmbeds\u003C/strong\u003E: \u003Ccode\u003E\u0026lt;iframe\u0026gt;\u003C/code\u003E is allowed only for trusted hosts - by default YouTube, youtube-nocookie, Vimeo and Google (maps). Other hosts can be added in \u003Ccode\u003Eappsettings.json\u003C/code\u003E under \u003Ccode\u003ESecurity:SanitizerAllowedIframeHosts\u003C/code\u003E.\u003C/li\u003E\n\u003Cli\u003E\u003Ccode\u003Edata:\u003C/code\u003E addresses are accepted only for images.\u003C/li\u003E\n\u003C/ul\u003E\n\u003Cp\u003EIf the content contains markup that is not allowed, saving fails with the message \u003Cem\u003Econtains HTML markup that is not allowed\u003C/em\u003E. Remove the offending element in code view and save again.\u003C/p\u003E\n\n\u003Ch2 id=\u0022why\u0022\u003EWhy this matters\u003C/h2\u003E\n\u003Cp\u003EContent entered in the admin is shown to every visitor and to other admins. A script in a product description could steal sessions; a form could phish passwords. The allowlist makes these impossible even if an admin account is compromised or a vendor writes their own descriptions.\u003C/p\u003E\n\n\u003Ch2 id=\u0022scripts\u0022\u003EIf you really need a script\u003C/h2\u003E\n\u003Cp\u003ETracking codes and chat widgets belong in a \u003Ca href=\u0022/content-widgets\u0022\u003Ewidget\u003C/a\u003E, in \u003Cstrong\u003ESystem \u2192 Custom JS\u003C/strong\u003E, or in the theme - not in a page body.\u003C/p\u003E\n\n\u003Ch2 id=\u0022related\u0022\u003ERelated\u003C/h2\u003E\n\u003Cul\u003E\n\u003Cli\u003E\u003Ca href=\u0022/content-pages\u0022\u003EPages\u003C/a\u003E\u003C/li\u003E\n\u003Cli\u003E\u003Ca href=\u0022/docs-system\u0022\u003ESystem and maintenance\u003C/a\u003E\u003C/li\u003E\n\u003C/ul\u003E\n","ParentCategoryId":"6abdec6c83d2816248229f03","SeName":"content-html-editor","MetaKeywords":null,"MetaDescription":"How the GrandNode admin HTML editor works, which HTML is allowed in pages, blog posts and descriptions, and how embeds such as YouTube are handled.","MetaTitle":null,"AllowComments":false,"Captcha":{"ReCaptchaChallengeField":null,"ReCaptchaResponseField":null,"ReCaptchaResponseValue":null,"ReCaptchaResponse":null},"RelatedArticles":[],"CategoryBreadcrumb":[{"Name":"Content management","Description":null,"IsCurrent":false,"Children":null,"Parent":null,"SeName":"docs-content","Id":"6abdec6c83d2816248229f03","UserFields":[]}],"AddNewComment":{"CommentText":null,"DisplayCaptcha":false,"Id":null,"UserFields":[]},"Comments":[],"Id":"6abdec6c83d2816248229f17","UserFields":[]}