Magento 2 Page Builder自定义内容类型设置菜单缺失求助

算力阿峰

2026-7-16

Magento 2 Page Builder自定义Quote内容类型设置菜单消失问题排查

我为Magento 2 Page Builder创建了自定义Quote内容类型，最初按Adobe官方指南实现后运行正常，但一周后发现该内容类型的设置菜单不再显示。输入字段可正常输入并保存数据，但设置菜单消失，其他内容类型的设置菜单显示正常。已执行清除缓存、刷新静态文件、重新编译、禁用再启用模块等操作，仍未解决。不清楚设置菜单的生成逻辑，附上相关配置文件寻求技术帮助。

相关配置文件

/app/code/Binea/PageBuilderQuote/view/adminhtml/pagebuilder/content_type/binea_quote.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_PageBuilder:etc/content_type.xsd">
    <type name="binea_quote"
        label="Quote"
        menu_section="elements"
        component="Magento_PageBuilder/js/content-type"
        preview_component="Binea_PageBuilderQuote/js/content-type/binea-quote/preview"
        master_component="Magento_PageBuilder/js/content-type/master"
        form="pagebuilder_binea_quote_form"
        icon="icon-pagebuilder-quote"
        sortOrder="21"
        translate="label">
    <children default_policy="deny"/>
    <parents default_policy="deny">
        <parent name="column" policy="allow"/>
    </parents>
    <appearances>
        <appearance name="default"
                  default="true"
                  preview_template="Binea_PageBuilderQuote/content-type/binea-quote/default/preview"
                  master_template="Binea_PageBuilderQuote/content-type/binea-quote/default/master"
                  reader="Magento_PageBuilder/js/master-format/read/configurable">
            <elements>
                <element name="main">
                    <style name="text_align" source="text_align"/>
                    <style name="border" source="border_style" converter="Magento_PageBuilder/js/converter/style/border-style"/>
                    <style name="border_color" source="border_color"/>
                    <style name="background_color" source="background_color"/>
                    <style name="background_image" source="background_image" converter="Magento_PageBuilder/js/converter/style/background-image" preview_converter="Magento_PageBuilder/js/converter/style/preview/background-image"/>
                    <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/border-width"/>
                    <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
                    <style name="margins" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/margins" converter="Magento_PageBuilder/js/converter/style/margins"/>
                    <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings"/>
                    <style name="display" source="display" converter="Magento_PageBuilder/js/converter/style/display" preview_converter="Magento_PageBuilder/js/converter/style/preview/display"/>
                    <attribute name="name" source="data-content-type"/>
                    <attribute name="appearance" source="data-appearance"/>
                    <css name="css_classes"/>
                </element>
                <element name="quote">
                    <style name="text_align" source="text_align"/>
                    <html name="quote_text" converter="Magento_PageBuilder/js/converter/html/tag-escaper"/>
                    <css name="quote_css"/>
                </element>
                <element name="author">
                    <style name="text_align" source="text_align"/>
                    <html name="quote_author" converter="Magento_PageBuilder/js/converter/html/tag-escaper"/>
                </element>
                <element name="author_title">
                    <style name="text_align" source="text_align"/>
                    <html name="quote_author_desc" converter="Magento_PageBuilder/js/converter/html/tag-escaper"/>
                </element>
            </elements>
        </appearance>
    </appearances>
    </type>
</config>

/app/code/Binea/PageBuilderQuote/view/adminhtml/ui_component/pagebuilder_binea_quote_form.xml

<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd" extends="pagebuilder_base_form_with_background_attributes">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">pagebuilder_binea_quote_form.pagebuilder_binea_quote_form_data_source</item>
        </item>
        <item name="label" xsi:type="string" translate="true">Quote</item>
    </argument>
    <settings>
        <namespace>pagebuilder_binea_quote_form</namespace>
        <deps>
            <dep>pagebuilder_binea_quote_form.pagebuilder_binea_quote_form_data_source</dep>
        </deps>
    </settings>
    <dataSource name="pagebuilder_binea_quote_form_data_source">
        <argument name="data" xsi:type="array">
            <item name="js_config" xsi:type="array">
                <item name="component" xsi:type="string">Magento_PageBuilder/js/form/provider</item>
            </item>
        </argument>
        <dataProvider name="pagebuilder_binea_quote_form_data_source" class="Magento\PageBuilder\Model\ContentType\DataProvider">
            <settings>
                <requestFieldName/>
                <primaryFieldName/>
            </settings>
        </dataProvider>
    </dataSource>
    <fieldset name="appearance_fieldset" sortOrder="10" component="Magento_PageBuilder/js/form/element/dependent-fieldset">
        <settings>
            <label translate="true">Appearance</label>
            <additionalClasses>
                <class name="admin__fieldset-visual-select-large">true</class>
            </additionalClasses>
            <collapsible>false</collapsible>
            <opened>true</opened>
            <imports>
                <link name="hideFieldset">${$.name}.appearance:options</link>
                <link name="hideLabel">${$.name}.appearance:options</link>
            </imports>
        </settings>
        <field name="appearance" formElement="select" sortOrder="10" component="Magento_PageBuilder/js/form/element/dependent-visual-select">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="default" xsi:type="string">default</item>
                </item>
            </argument>
            <settings>
                <additionalClasses>
                    <class name="admin__field-wide">true</class>
                    <class name="admin__field-visual-select-container">true</class>
                </additionalClasses>
                <dataType>text</dataType>
                <validation>
                    <rule name="required-entry" xsi:type="boolean">true</rule>
                </validation>
                <elementTmpl>Magento_PageBuilder/form/element/visual-select</elementTmpl>
            </settings>
            <formElements>
                <select>
                    <settings>
                        <options class="AppearanceSourceQuote"/>
                    </settings>
                </select>
            </formElements>
        </field>
    </fieldset>
    <fieldset name="general" sortOrder="20">
        <settings>
            <label/>
        </settings>
        <field name="quote_text" sortOrder="10" formElement="textarea">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">page</item>
                </item>
            </argument>
            <settings>
                <dataScope>quote_text</dataScope>
                <dataType>text</dataType>
                <label translate="true">Quote</label>
            </settings>
        </field>
        <field name="quote_author" sortOrder="20" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">page</item>
                </item>
            </argument>
            <settings>
                <dataScope>quote_author</dataScope>
                <dataType>text</dataType>
                <label translate="false">Author</label>
            </settings>
        </field>
        <field name="quote_author_desc" sortOrder="30" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">page</item>
                </item>
            </argument>
            <settings>
                <dataScope>quote_author_desc</dataScope>
                <dataType>text</dataType>
                <label translate="false">Author Description</label>
            </settings>
        </field>
        <field name="quote_css" sortOrder="40" formElement="select">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="default" xsi:type="string">black-quote</item>
                </item>
            </argument>
            <settings>
                <dataType>text</dataType>
                <label translate="true">Quote Color</label>
            </settings>
            <formElements>
                <select>
                    <settings>
                        <options>
                            <option name="0" xsi:type="array">
                                <item name="value" xsi:type="string">black-quote</item>
                                <item name="label" xsi:type="string" translate="true">Black</item>
                            </option>
                            <option name="1" xsi:type="array">
                                <item name="value" xsi:type="string">blue-quote</item>
                                <item name="label" xsi:type="string" translate="true">Blue</item>
                            </option>
                            <option name="2" xsi:type="array">
                                <item name="value" xsi:type="string">green-quote</item>
                                <item name="label" xsi:type="string" translate="true">Green</item>
                            </option>
                            <option name="3" xsi:type="array">
                                <item name="value" xsi:type="string">red-quote</item>
                                <item name="label" xsi:type="string" translate="true">Red</item>
                            </option>
                            <option name="4" xsi:type="array">
                                <item name="value" xsi:type="string">purple-quote</item>
                                <item name="label" xsi:type="string" translate="true">Purple</item>
                            </option>
                        </options>
                    </settings>
                </select>
            </formElements>
        </field>

    </fieldset>
</form>

/app/code/Binea/PageBuilderQuote/view/adminhtml/layout/pagebuilder_binea_quote_form.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <update handle="styles"/>
    <body>
        <referenceContainer name="content">
            <uiComponent name="pagebuilder_binea_quote_form"/>
        </referenceContainer>
    </body>
</page>

排查建议

1. 检查AppearanceSourceQuote类有效性

在UI组件配置中，外观选择器指定了AppearanceSourceQuote类，需确认：

该类存在于Binea\PageBuilderQuote\Model\Config\Source\AppearanceSourceQuote.php路径
类正确实现了Magento\Framework\Data\OptionSourceInterface接口，toOptionArray()方法返回有效选项数组
类的命名空间和类名拼写无错误

如果该类缺失或实现错误，会导致UI组件加载失败，直接隐藏设置菜单。

2. 验证表单继承的兼容性

表单当前继承pagebuilder_base_form_with_background_attributes，若该基础表单有版本更新或配置冲突，可能导致加载异常。可临时修改表单配置，移除继承关系测试：

<!-- 修改前 -->
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd" extends="pagebuilder_base_form_with_background_attributes">
<!-- 修改后 -->
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">

修改后执行缓存清理，查看设置菜单是否恢复。

3. 检查浏览器JS控制台报错

打开浏览器开发者工具（F12）→ Console面板，查看是否有以下类型报错：

Magento_PageBuilder/js/form/element/dependent-fieldset或dependent-visual-select组件加载失败
自定义preview组件Binea_PageBuilderQuote/js/content-type/binea-quote/preview存在语法错误
UI组件数据绑定异常

JS报错会直接阻止设置菜单渲染，需修复对应错误。

4. 确认内容类型与表单的关联

在binea_quote.xml中，form="pagebuilder_binea_quote_form"需与UI组件的name完全一致，检查是否存在拼写错误。若名称不匹配，Page Builder无法关联到对应的设置表单。

5. 验证布局文件加载

确认pagebuilder_binea_quote_form.xml布局文件被正确加载：

查看admin页面的HTML源码，搜索pagebuilder_binea_quote_form，确认该UI组件已被渲染到页面中
检查模块的module.xml是否正确声明了依赖Magento_PageBuilder和Magento_Ui

内容的提问来源于stack exchange，提问作者Natalie Hedström

Magento 2 Page Builder自定义内容类型设置菜单缺失求助

相关配置文件 #

/app/code/Binea/PageBuilderQuote/view/adminhtml/pagebuilder/content_type/binea_quote.xml #

/app/code/Binea/PageBuilderQuote/view/adminhtml/ui_component/pagebuilder_binea_quote_form.xml #

/app/code/Binea/PageBuilderQuote/view/adminhtml/layout/pagebuilder_binea_quote_form.xml #

排查建议 #

1. 检查AppearanceSourceQuote类有效性 #

2. 验证表单继承的兼容性 #

3. 检查浏览器JS控制台报错 #

4. 确认内容类型与表单的关联 #

5. 验证布局文件加载 #