Skip to content

Magento 2 Page Builder – custom content type missing settings

I have been trying to create a custom content type for the Magento 2 Page Builder.
In order to do this I followed adobes guide for this

I managed to get the content type up and running correctly without a hitch, then I worked on some other stuff and when I got back to it a week or so later I can not manage to get the settings menu to appear anymore.

It works correctly on other content types as you can see here
working content type

But when it comes to my quote content type I get the input fields correctly and can input and save the data but the settings refuse to appear anymore.

quote content type

I don’t really know where to start looking into this since I am unsure exactly what generates the setting menu.

I am not sure exactly wich files are relevant here to share but I will share the ones I belive can be of help.

/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="MagentoPageBuilderModelContentTypeDataProvider">
            <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>