How to add the product widget to your Shopify store (Shopify 2.0)
To add the product widget to your site, please see the following guidelines;
Go to Online Store in your dashboard

Click on Customize

At the top of the page, select Products

Click on Default Product or it's equivalent (what you have in your store)

Here, there are two steps involved. You can decide to add the widget as a block or as a section. You can learn more about them here: https://help.shopify.com/en/manual/online-store/themes/os20/theme-structure/sections/.
For me, I'd prefer to add the product widget as a section so that it stands on its own and is nicely laid out on the site.
So the next step would be to click on add a section

Then choose the product widget

Once clicked on, it will load on your site like it shows below.

Remember to save your work

If you're using a block: Follow the steps below
Click on add block

Select Product Widget

This is how it looks like when added as a block in the product information section. It takes the structure of all blocks in that section.

You can decide to move it up or down depending on your preference by clicking on the drag and drop icon ⋮⋮

Remember to save your work.
Go to Online Store in your dashboard

Click on Customize

At the top of the page, select Products

Click on Default Product or it's equivalent (what you have in your store)

Here, there are two steps involved. You can decide to add the widget as a block or as a section. You can learn more about them here: https://help.shopify.com/en/manual/online-store/themes/os20/theme-structure/sections/.
For me, I'd prefer to add the product widget as a section so that it stands on its own and is nicely laid out on the site.
So the next step would be to click on add a section

Then choose the product widget

Once clicked on, it will load on your site like it shows below.

Remember to save your work

If you're using a block: Follow the steps below
Click on add block

Select Product Widget

This is how it looks like when added as a block in the product information section. It takes the structure of all blocks in that section.

You can decide to move it up or down depending on your preference by clicking on the drag and drop icon ⋮⋮

Remember to save your work.
Updated on: 10/12/2024
Thank you!