Shopify Apps

Generally speaking all Shopify Apps that are backend only will work without any particular configuration, while for frontend apps, case by case you have to double check if the app can work in headless mode.

Note

Backend Apps: all apps that do not require to inject widgets or code into your own Webflow site. E.G: order invoices, product importers, inventory management etc.

Frontend Apps: all apps that instead inject widgets or code into your own Webflow site. E.G: Instafeed, Shopify Inbox etc.

Many of the frontend apps are still compatible with your Webflow site, but do require a bit of configuration or manual code.

We have created a list of tested integrations that comprehend both tested backend and frontend apps.

The list is not exclusive naturally, so contact us if an app you want to use is not listed yet, so we can help you find an alternative, or help you integrate it!

App Embeds

Some Shopify Apps do work by enabling App Embeds from the Shopify Customizer and are compatible with Webflow as well! We have created a tool inside the dashboard that automatically will help you using app embeds. This feature automatically parses the code of some apps and modifies it in order to make it compatible with Webflow & Smootify!

Every time we test and found new app embeds that are compatible with Webflow we will update the integration page! So be sure to subscribe to our newsletter to stay updated about the new app features you can use!

How to enable the Apps

First, go to the Shopify dashboard. On the main menu on the left, click on Online Store and go on Customize

Note

If you have already installed the Redirect theme for the correct redirection of the checkout page links of your project, as shown in this guide, temporarily delete the URLs you added before performing this operation. Don’t forget to re-enter them at the end of this operation.

Where to temporarily delete URL:

1. Now you need to activate all the third-party apps (compatible with Smootify) that you want to show on your Webflow project. To do this, go to the App Embeds section in the upper left corner and enable the third-party apps compatible with Smootify.

2. Open the menu in the upper left corner and click on View.

3. From this empty preview, you will need to click CMD+S (Mac) or CTRL+S (Windows). You will be prompted to save the HTML page. Remember to select HTML ONLY before saving the file.

   For Windows:

For Mac:

4. Once you have saved the file, go to the App embeds section of Smootify and drag the file you just saved into the dotted area.

5. You will automatically see all the listed Shopify Third Party Apps enabled in your store.

6. To complete the configuration correctly, follow the instructions for each individual App to copy the code into the appropriate section in Webflow.

Known supported app embeds:

• Shopify Inbox
• Instafeed
• Klaviyo Onsite Javascript
• Appointment Booking Cowlendar
• Shopify Forms