How to remove the space character in text editor?

Question

In the category setup, you can add an image (banner) and some text description. But, if the description is left empty, there are still an invisible character in the source code for the page (a space?).

Is it possible to get rid of this? The reason I want this, is that I like to have a background color on the element "cms-element-text". But if it's empty (no text) I dont want to have a thin stripe of the background color still left.

Is this possible?

Answer 1

The editor has a html view (the </> symbol on the right of the toolbar). Check that there are no stray elements left.

For me the element is collapsing to zero height with no content and no background is visible. This could be depending on the browser though. If you have to be sure, you could simply not render the element, when the content is empty.

Extend storefront/element/cms-element-text.html.twig

{% sw_extends '@Storefront/storefront/element/cms-element-text.html.twig' %}

{% block element_text %}
    {% if element.data.content|trim is not empty %}
        {{ parent() }}
    {% endif %}
{% endblock %}