What Are Widgets In Magento 2?
In simple words, the widget is a content block that consists of images, text, and interactive elements. You can easily display the widget on any page (home, simple product page, grouped product page, category page,…) and any positions (e.g.: page header, page footer, page bottom, …) on your site. In general, the purposes of using the widgets are to enhance the interaction between customers and the store. For instance, you can use the widget to draw visitors’ attention to the new promotional campaigns/ new products/ featured items, to stimulate them to leave feedback, participate in a poll, and so on.
How To Create A Custom Widget In Magento 2?
There are just 3 simple steps to create a new custom widget in Magento 2. Let’s get started!
The 1st step: Add A New Widget
Go to the admin panel, navigate to CONTENT and choose Widgets (under Elements)
(Admin Panel => CONTENT => Widget)
Then, click on the Add Widget button to create a new widget.
After that, select the type of widget that you want to create as well as choose the Design Theme (your current theme).
Click on the Continue button when you complete the settings.
The 2nd step: Add Widget Information
You must complete the Storefront Properties by adding the title of the widget, choosing a store view, setting a sort order for the widget (when there is more than one widget in the same place, only the one that has higher priority – a lower number is displayed). Also, you need to set up where to show the widget – select a specific position in a/ some pages in the Layout Updates section.
The 3rd step: Select A Block Included In The Widget
Moving to the Widget Options. Let’s click on the Select Block button and choose a block that you want to appear in the widget.
After you select the block, let’s save the configuration, go to your storefront and check the results.
We have shown you the basic conception of the widgets in Magento 2 and more importantly, how to create a custom one in the back-end menu. If you have any problems when following this tutorial, be free to ask us by leaving a comment below. See you in the next tutorials!
See More Our Magento “How To” Series: