Создание содержимого виджета в конструкторе страниц

Question

Создание содержимого виджета в конструкторе страниц

Мне нужно показать на своей домашней странице список товаров-бестселлеров определенной категории. Для этого я уже программно создал свой собственный виджет, в котором перечислены продукты-бестселлеры, но нет способа перетащить содержимое виджета с помощью конструктора страниц. Я знаю, что могу перетащить содержимое HTML и вставить туда свой виджет, но мне интересно, есть ли лучшее решение.

Каков наилучший способ достичь этого? Есть ли способ расширить конструктор страниц, чтобы я мог добавить тип виджета? Не могли бы вы порекомендуйте какой-нибудь другой вариант?

1

magento2.3.1 page-builder magento-enterprise-2

Author: Antonio, 2019-05-17

Source

1 answers

score 4 · Accepted Answer

У вас есть несколько вариантов. Самым простым является использование типа текстового контента для включения виджета с использованием стандартной функции виджета TinyMCE.

Другой вариант - создать новый тип контента, который заключает ваш виджет в тип контента конструктора страниц. Наш тип контента "Продукты" делает именно это, это просто интерфейс для виджета "Список продуктов каталога".

products.xml содержит преобразователь массы для создания директивы виджета:

view/adminhtml/pagebuilder/content_type/products.xml

<converters>
    <converter component="Magento_PageBuilder/js/content-type/products/mass-converter/widget-directive" name="widget_directive">
        <config>
            <item name="html_variable" value="html"/>
        </config>
    </converter>
</converters>

Который, в свою очередь, в widget-directive.ts (или JS в зависимости от того, какой источник вы просматриваете) мы создаем стандартную директиву виджета списка продуктов:

view/adminhtml/web/ts/js/content-type/products/mass-converter/widget-directive.ts:

    public toDom(data: ConverterDataInterface, config: ConverterConfigInterface): object {
        const attributes = {
            type: "Magento\\CatalogWidget\\Block\\Product\\ProductsList",
            template: "Magento_CatalogWidget::product/widget/content/grid.phtml",
            anchor_text: "",
            id_path: "",
            show_pager: 0,
            products_count: data.products_count,
            type_name: "Catalog Products List",
            conditions_encoded: this.encodeWysiwygCharacters(data.conditions_encoded || ""),
        };

        if (attributes.conditions_encoded.length === 0) {
            return data;
        }

        set(data, config.html_variable, this.buildDirective(attributes));
        return data;
    }

Вы можете прочитать больше о преобразователях массы здесь: https://devdocs.magento.com/page-builder/docs/reference/configurations.html#mass-converter

Вы можете дублировать тип контента продуктов и изменять его в соответствии с вашими потребностями. На высоком уровне он просто вводит настроенные поля формы в параметры директивы.

Наряду с вышесказанным, у нас есть отличное пошаговое руководство по созданию нового типа контента, доступное здесь: https://devdocs.magento.com/page-builder/docs/create-custom-content-type/overview.html