I need to show in my home page a bestseller products list of certain category. To do so, i already created programmatically my own widget that lists bestseller products, but there's no way to drag a widget content with page builder. I know that i can drag a HTML content and insert there my widget, but i wonder if there's a better solution.
What's the best way to achieve it? Is there any way to extend Page Builder so i can add a widget type? Would you recommend any other option?
Best Answer
You have a couple of options. The simplest is using the Text content type to include the widget using the standard TinyMCE widget feature.
Your other option is to create a new content type which wraps your widget in a Page Builder content type. Our Products content type does exactly this, it's just an interface for the Catalog Product List widget.
products.xml
contains a mass converter to create the widget directive:view/adminhtml/pagebuilder/content_type/products.xml
Which in turn within
widget-directive.ts
(or JS depending on which source you're viewing) we create the standard product list widget directive:view/adminhtml/web/ts/js/content-type/products/mass-converter/widget-directive.ts
:You can read more about mass converters here: https://devdocs.magento.com/page-builder/docs/reference/configurations.html#mass-converter
You can look to duplicate the Products content type and modify it to your needs. On a high level, it just feeds it's configured form fields into the directive's parameters.
Alongside the above, we have a great step by step tutorial on how to create a new content type available here: https://devdocs.magento.com/page-builder/docs/create-custom-content-type/overview.html