User Guide - How to add the recommendation widget to your BigCommerce site
To add the recommendation widget to checkout page, we need to use editing theme files (Advanced) approach.
Note: If you are theme developer, skip this tutorial and use your local stencil development environment to insert the widget HTML snippet
- Go to BigCommerce Admin Panel -> Storefront -> My Themes
- Under "Current Theme" section, click on Advanced -> Edit Theme Files to open the Stencil Theme Editor in a new window.
Note: if you are using a out of the box BigCommerce theme, you may not see the "Edit Theme Files" option. You will need to click on "Make a Copy" first to make a copy of your theme, then apply the theme copy as your current theme in order to edit the theme files. See BigCommerce official document for details.
- On the left side of the Stencil Theme Editor, click on templates -> pages -> checkout.html to open the checkout page html template. Note: the files layout and content may vary based on different themes.
- In the checkout.html file, add the widget HTML snippet
at the desired place. See this for how to edit the theme file.
- Click on "Save & apply file" to save your changes. It may take several minutes to save and apply the changes to your store website.
- Now go to the checkout page of your website. Voilà, the recommendation widget shows up on the checkout page!