In the videos below, we will guide you through the process of installing Sizefox on your Shopify store.

In the first video you will see the implementation for the Shopify 2.0 Theme. If you are working with a Shopify Vintage Theme, please follow the instructions in the second video instead.

Shopify 2.0 Theme

Transcript

Today, we will show you how to install and set up Siefox on your Shopify 2.0 Theme. Enter your dashboard and click on the Install button. You will be redirected to the Shopify App landing page.

From this screen, click on “Add App” to proceed with the installation. If you have several shops ensure you connect to the chosen one. You will see a list of all the shops connected to your Shopify account. Pick the shop on which you want to install Sizefox to move forward with the installation.

Shopify will ask you to authorize the App. Click on “Install app” to proceed. Once installed you will be automatically redirected to your Sizefox dashboard. The set up might take a few seconds, and once finished a success message will appear and Sizefox will be connected to your store.

Now let’s add the widget to your product pages. In the store set up screen, click on the Next button. You’ll be provided two options. Open the one named “Integrating into an online store 2.0”.

Now you’ll be able to see the detailed instructions: Copy the org id and go to your Shopify store. From the side bar menu of your Shopify Admin, go to Online Store and then Themes. Now that you are here, click the customize button.

Open the dropdown located at the top of the page and choose “Default product”. On the left side panel you can now go to the product information section and click on add block.

In the dropdown, select Sizefox. Drag the new app-block to the position you want the find-my-size button to appear. Select the Sizefox block to access the contextual menu and paste your personalized orgId.

Here you may also change the Colour Settings reflected on the “Find my Size” button. The primary color is the default color of the button and the secondary is the color on hover. Once these steps are done, do not forget to save.

After these steps, go back to your Sizefox admin dashboard and click on Next. You are done! You can now move forward with creating your first size chart.

Shopify Vintage Theme

Transcript

Today, we will show you how to install and set up Sizefox on your Shopify Vintage theme. Enter your Sizefox dashboard and click on the Install button. You will be redirected to the Shopify listing page. From this screen, click on Add App to proceed with the installation. If you have several shops ensure you connect to the chosen one. If you have several shops, pick the one on which you want to install Sizefox to move forward with the installation.

Shopify will ask you to authorize the App. Click on “Install app” to proceed. Once installed you will be automatically redirected to your Sizefox dashboard.

The set up might take a few seconds, once finished a success message will appear and Sizefox will be connected to your store. Let’s now add the widget to your product pages. In the store set up screen, click on the Next button.

You’ll be provided two options. Open the one named “Integration into a Vintage Theme”. Here you can see the detailed instructions for the set up. Copy the Code Snippet to your clipboard and go to the your Shopify Admin.

In the code edit console look for the file named ‘product_template.liquid’ or ‘main-product.liquid’. Once on the right file, scroll down at the very bottom, add a new line and paste the snippet. Once this is done, do not forget to click on save.

Note that every theme is different and your files might have different names. It is important that you insert the snippet in the liquid file of your main product template page.

Little tip: by default our “Find my Size” button will put itself under your “add to cart” button. If you would like to change the position of the button on your product page, you can paste the second snippet in the same template file where you want your “Find my size” button to appear, and save. If you added this second snippet, again do not forget to save.

You have now added the snippet to your product pages. You can now return to your Sizefox dashboard, click on “next’ and move on to creating your first size chart.