Magento2 使用自定义HTML包装WYSIWYG内容

本篇博客将向您展示如何围绕“content”引用设置自定义HTML包装元素（但可以应用于其他模块中的任何引用）。让我们开始吧。

首先，需要设置以下文件夹结构：

app/design/frontend/your_namespace/your_theme/Magento_Cms/layout

在layout文件夹中，应创建3个XML文件：

• catalogsearch_advanced_index.xml - 此文件表示任何模块/控制器/操作路由映射（因此在这种情况下，这将在用户访问/ catalogsearch /高级路由在浏览器中时加载）
• cms_page_view.xml - 打开任何CMS页面时将加载此文件（例如，主页，关于我们，客户服务......）
• cms_page_view_id_enable-cookies.xml - 只有在浏览器中打开特定页面时才会加载此文件（在本例中为“启用Cookie”页面）。根据经验，XML文件应根据以下内容命名：cms_page_view_id_{{page-identifier}}.xml

包装使用route-specific更新

将以下代码粘贴到catalogsearch_advanced_index.xml的body节点中：

<referenceContainer name="content" htmlTag="div" htmlClass="advancedsearch-class" htmlId="advancedsearch-id" />

包装使用page-global更新

将以下代码粘贴到cms_page_view.xml的body节点中：

<referenceContainer name="content" htmlTag="div" htmlClass="wysiwyg-general-class" htmlId="wysiwyg-general-id" />

包装使用page-specific更新

将以下代码粘贴到cms_page_view_id_enable-cookies.xml的body节点中：

<referenceContainer name="content" htmlTag="div" htmlClass="wysiwyg-specific-class" htmlId="wysiwyg-specific-id" />

包装使用static-block-specific更新

所有需要做的就是创建自定义块作为content引用的子节点，如下面的代码所示：

<block class="Magento\Framework\View\Element\Text\ListText"
       name="block-container-wrapper-name"
       as="block-container-wrapper-id"
       htmlTag="div"
       htmlClass="block-class"
       htmlId="block-id">
    <block class="Magento\Cms\Block\Block" name="cms_test_block">
        <arguments>
            <argument name="block_id" xsi:type="string">test-block</argument>
        </arguments>
    </block>
</block>

关于这篇文章有两件重要的事情要提到：

1. 如果要在全局页面和特定页面设置自定义包装设置自定义包装，请注意，特定页面的值将覆盖全局页面全局的值
2. 允许的HTML标记列表如下： dd, div, dl, fieldset, main, header, footer, ol, p, section, table, tfoot, ul, nav