HTML Sanitizer

Please note that this article is only aimed at users of a self-hosted shop. For cloud stores, there is no possibility of implementation at this time.

With Shopware version 6.5, an HTML sanitizer has been implemented. This sanitizer improves security, reliability and usability of the editor by removing unsafe HTML code. It also sanitizes styles and attributes for consistent and correct code rendering regardless of platform and browser.

For example, if the tag img is added, it is automatically removed by the editor after a few seconds and an additional notice appears that some of your inputs have been sanitised.

Whitelisting

For all further steps a basic understanding of YAML and its syntax is necessary.

Through a workaround or an adjustment of the z-shopware.yaml file, it is possible to add the tag img to the allowed code.

The z-shopware.yaml is located below config/packages/ on the server where Shopware is installed. By default, this file does not exist. A simple copy of the shopware.yaml in the same directory solves this obstacle.

In the copied shopware.yaml (z-shopware.yaml), inside the shopware: key another key called html_sanitizer: is needed. Inside the key all other values and wildcards are added.

In this example, the img tag, as well as the CSS attributes src, alt and style are added to the whitelist:

shopware:
    html_sanitizer:
        sets:
            -   name: basic
                tags: [ "img" ]
                attributes: [ "src", "alt", "style" ]
                options:
                    - key: HTML.Trusted
                      value: true
                    - key: CSS.Trusted
                      value: true