super.so shopify integration

Adding Shopify to a super.so website is relatively straight forward and only requires a few things to work.

embedding code into a notion website

This topic has already been covered for a previous project here so there is no need to reiterate the steps. Once code can be reliably embedded it is time to move on to finding the code that needs to be embedded.

getting the embed code from shopify

individual products can be embedded, but I prefer to embed collections. This allows for control over what is displayed and can be used to create curated lists of products.

creating a collection

In the admin section of Shopify, Navigate to the Collections page with in the Products menu. Create a collection and add products to display.

copy the embed code for the collection

Open the collection. Hover over the More Actions button in the upper right. Select Embed on a website.

There are two main components to the code shown in the box:

The HTML portion of code:

<div id='collection-component-############'></div>

The script portion of code:

<script type="text/javascript">
</script>

adding the embed code

The HTML portion should be added to a /code block in the Notion page the shop is located on. The script portion should be added to that pages header code in super.so.

result

After those two sections are added the shop should display in that page.