Note: If you are theme developer, skip this tutorial and use your local liquid development environment to insert the widget HTML snippet . Otherwise, please continue reading.

1. Go to Shopify Admin Panel -> Online Store -> Themes
   
2. Under "Current Theme" section, click on Actions -> Edit code to edit the liquid theme code.
   
3. On the left side of the Theme Editor, click on Sections ->Add a new section to add a new template file for the recommendation widget. Note: the files layout and content may vary based on different themes.
   
4. Give the new template a name and click on create section button. In this example, we named it as "recommendation-widget".
   
5. In the newly created widget liquid template file, add the widget HTML snippet at the first line, and change the name of the template in the schema. See Shopify official documentation for how to edit the theme file.
   
6. Click on "Save" to save your changes.
7. On the left side of the Theme Editor, click on Config ->settings_data.json to declare the newly created recommendation widget template as a section so that we can insert it to the home page.
   
8. In the settings_data.json, under "current" -> "sections", add the new template you just defined. the "type" should match the template name.
   
9. Scroll down to the "content_for_index" section under the same "current" section, and add the new section to the desired place on the home page. For example, if you want to display the recommendation widget between the hero image and the featured collections, then put the new section in between those two sections:
   
10. Click on "Save" to save your changes.
11. Now go to the home page of your website that you just edited. Voilà, the recommendation widget shows up on the page!