在CKeditor中编辑Twig模板

Ale*_*xey 13 fckeditor ckeditor symfony twig

我正在尝试允许管理员用户编辑电子邮件模板.这些模板作为Twig存储在DB中.所以它们中的变量被设置为,{{ purchase.number }}并且有类似的循环

    {% if cart['shipping'] %}
        {% for line in cart['shipping'] %}
            <tr>
                <td colspan="7">Shipping ({{ line['text'] }})</td>
                <td>US${{ line['money'] }}</td>
            </tr>
        {% endfor %}
    {% endif %}
Run Code Online (Sandbox Code Playgroud)

下面是我可以重现此问题的模板之一:

        <html>
    <body>
        <h3>Order #{{ purchase.number }} was cancelled</h3>
        <p>Order content:</p>
        <table>
            <tr>
                <th>Line</th>
                <th>Item #</th>
                <th>Product Name</th>
                <th>Shipping</th>
                <th>UOM</th>
                <th>Unit Price</th>
                <th>Quantity</th>
                <th>Subtotal</th>
            </tr>
            {% for line in cart['cart'] %}
                <tr>
                    <td>{{ line['LineNo'] }}</td>
                    <td>{{ line['ItemNo'] }}</td>
                    <td>{{ line['ProductName'] }}</td>
                    <td>{{ line['Shipping'] }}</td>
                    <td>{{ line['UOM'] }}</td>
                    <td>US${{ line['UnitPrice'] }}</td>
                    <td>{{ line['Quantity'] }}</td>
                    <td>US${{ line['Subtotal'] }}</td>
                </tr>
            {% endfor %}
            {% if cart['shipping'] %}
                {% for line in cart['shipping'] %}
                    <tr>
                        <td colspan="7">Shipping ({{ line['text'] }})</td>
                        <td>US${{ line['money'] }}</td>
                    </tr>
                {% endfor %}
            {% endif %}
            <tr>
                <td colspan="7"><b>Order Item Total:</b></td>
                <td>US${{ cart['total'] }}</td>
            </tr>
        </table>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

当我用CKEditor textarea打开一个包含此模板的页面时,我不对模板进行任何更改,只需单击"Source"按钮,这就是上面提到的模板在点击后的样子:

<h3>Order #{{ purchase.number }} was cancelled</h3>

<p>Order content:</p>
{% for line in cart[&#39;cart&#39;] %} {% endfor %} {% if cart[&#39;shipping&#39;] %} {% for line in cart[&#39;shipping&#39;] %} {% endfor %} {% endif %}

<table>
    <tbody>
        <tr>
            <th>Line</th>
            <th>Item #</th>
            <th>Product Name</th>
            <th>Shipping</th>
            <th>UOM</th>
            <th>Unit Price</th>
            <th>Quantity</th>
            <th>Subtotal</th>
        </tr>
        <tr>
            <td>{{ line[&#39;LineNo&#39;] }}</td>
            <td>{{ line[&#39;ItemNo&#39;] }}</td>
            <td>{{ line[&#39;ProductName&#39;] }}</td>
            <td>{{ line[&#39;Shipping&#39;] }}</td>
            <td>{{ line[&#39;UOM&#39;] }}</td>
            <td>US${{ line[&#39;UnitPrice&#39;] }}</td>
            <td>{{ line[&#39;Quantity&#39;] }}</td>
            <td>US${{ line[&#39;Subtotal&#39;] }}</td>
        </tr>
        <tr>
            <td colspan="7">Shipping ({{ line[&#39;text&#39;] }})</td>
            <td>US${{ line[&#39;money&#39;] }}</td>
        </tr>
        <tr>
            <td colspan="7"><b>Order Item Total:</b></td>
            <td>US${{ cart[&#39;total&#39;] }}</td>
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

请注意,不仅单引号更改为html代码,但主要是循环被移动,因此它曾经是:

        {% if cart['shipping'] %}
            {% for line in cart['shipping'] %}
                <tr>
Run Code Online (Sandbox Code Playgroud)

但变成:

{% for line in cart[&#39;cart&#39;] %} {% endfor %} {% if cart[&#39;shipping&#39;] %} {% for line in cart[&#39;shipping&#39;] %} {% endfor %} {% endif %}
Run Code Online (Sandbox Code Playgroud)

如果这些实体不是html并且我没有做任何更改,为什么CKEditor会更改源代码,我甚至不关注该字段.

我尝试使用这些CKEditor配置选项:

CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;
CKEDITOR.config.entities = false;

CKEDITOR.config.forcePasteAsPlainText = false; // default so content won't be manipulated on load
CKEDITOR.config.basicEntities = true;
CKEDITOR.config.entities = true;
CKEDITOR.config.entities_latin = false;
CKEDITOR.config.entities_greek = false;
CKEDITOR.config.entities_processNumerical = false;
CKEDITOR.config.fillEmptyBlocks = function (element) {
    return true; // DON'T DO ANYTHING!!!!!
};
Run Code Online (Sandbox Code Playgroud)

但我仍然经历过这一点.任何人都可以建议配置选项或任何其他解决方法,除了不使用WYSIWYG.我试图说服用户编辑html/twig,但只是想要WYSIWYG.谢谢

Dan*_*Lee 7

对我来说,一种可能的解决方法是将Twig块添加到config.protectedSource:

CKEDITOR.config.protectedSource.push(/\{%\s.+\s%\}/g);
Run Code Online (Sandbox Code Playgroud)

它们将在WYSIWYG编辑器中被忽略,但仍会在源代码视图中可见.

此外,您可以安装插件显示保护,仍然有一个可见的提示.