> ## Documentation Index
> Fetch the complete documentation index at: https://docs.usesuperflow.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Setup

> How to setup Superflow with Shopify

## 1) Enter Your Site URL

Enter the site URL you want Superflow to be installed in.

<Frame>
  <img src="https://mintcdn.com/superflow/gnnXgtB9B2DXpreO/images/enter-url-final.png?fit=max&auto=format&n=gnnXgtB9B2DXpreO&q=85&s=70fcaae4e19e53003e35d892eff89874" alt="" width="3736" height="1797" data-path="images/enter-url-final.png" />
</Frame>

## 2) Select Shopify from the list of Platforms

Choose Shopify from the list of options to install Superflow with Shopify.

<Frame>
  <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/select-shopify-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=38f4b5430d1ebcc6826bfe1dfc2af92f" alt="" width="3696" height="1777" data-path="images/select-shopify-final.png" />
</Frame>

## 3) Copy your unique Superflow code

You can copy your unique Superflow code from the onboarding flow or from your project settings in your dashboard.

<Frame>
  <img src="https://mintcdn.com/superflow/XWbQ_WnDAi9pqsmS/images/copy-code-final.png?fit=max&auto=format&n=XWbQ_WnDAi9pqsmS&q=85&s=9a507d4b7245b769dc531779a40ccbfd" alt="" width="3006" height="1457" data-path="images/copy-code-final.png" />
</Frame>

## 4) Go to the Themes setting on your Webflow Site and edit the code.

You can get to the Themes setting at the bottom left of the side menu. Then next to the Customize button, click the ... button and then click Edit Code.

<Frame>
  <img src="https://mintcdn.com/superflow/XWbQ_WnDAi9pqsmS/images/code-shopify-final.png?fit=max&auto=format&n=XWbQ_WnDAi9pqsmS&q=85&s=24ed1f319188825f3c0fe066b3ecccd0" alt="" width="3662" height="1769" data-path="images/code-shopify-final.png" />
</Frame>

## 5) Add your unique Superflow code in the Footer section

Click `Sections` on the side menu and then click on the `footer.liquid` file.

Next, do a ctrl F search for `</footer>`.

You should paste your Superflow code snippet right above the `</footer>` tag.

Be sure to save.

<Frame>
  <img src="https://mintcdn.com/superflow/gnnXgtB9B2DXpreO/images/footer-shopify-final.png?fit=max&auto=format&n=gnnXgtB9B2DXpreO&q=85&s=e1b94e1a73e14873dde62a471ad8c372" alt="" width="3690" height="1763" data-path="images/footer-shopify-final.png" />
</Frame>

## 6) Verify your Installation

Verify your Superflow installation by clicking the Verify button on the onboarding flow.

<Frame>
  <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/verify-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=890ba1333755e4d746505cc619a2c03a" alt="" width="2998" height="1459" data-path="images/verify-final.png" />
</Frame>

If successful, you should be redirected to your published Shopify site and see the following success message:

<Frame>
  <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/verified-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=6e1b9b3a5fd451707b5fb936573ef56a" alt="" width="1366" height="1206" data-path="images/verified-final.png" />
</Frame>

## 7) Troubleshooting

Having trouble getting your verifying your installation? Here are the common mistakes users encounter when installing Superflow:

* Did you forget to save the Custom Code?
* Did you forget to publish your site?
* Is the browser still loading a cached version?
* Did you add `?review=true` at the end of your url?
* Did you publish your changes on a staging URL while you are trying to access a Prod URL?
* Did you accidentally install multiple Superflow scripts in the Custom Code?

## 8) Navigate to your Shopify site

Now that you have verified that Superflow has been installed on your Shopify site, navigate to your published site and add `?review=true` at the end of the URL to enable Superflow.

`Example: mywebsite.shopify.com/?review=true`

If you are unsure, what your Shopify site URL is, you can click the Preview button at the top right of the Themes settings page.

<Frame>
  <img src="https://mintcdn.com/superflow/uK-U8b-1fpW-Yhti/images/preview-shopify-final.png?fit=max&auto=format&n=uK-U8b-1fpW-Yhti&q=85&s=03e85441b42136601eda056911688f1c" alt="" width="3696" height="1761" data-path="images/preview-shopify-final.png" />
</Frame>

## 9) Test out Superflow

You should now see a Superflow toolbar on the bottom right of you screen.

<Frame>
  <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/toolbar-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=66f1b92617285d5dfc12df908b54e488" alt="" width="3678" height="1775" data-path="images/toolbar-final.png" />
</Frame>

## 10) Dropping your first comment

Try leaving a comment on your page.

You can leave a comment in several different ways:

* By highlighting any text
* By hovering over any element on the page
* By drawing a box anywhere on the page

You can also leave voice and screen recordings in your comments as well!

<Frame>
  <img src="https://mintcdn.com/superflow/XWbQ_WnDAi9pqsmS/images/demo.gif?s=013fcafea837a87dcad1c0d516e1ebee" alt="" width="640" height="360" data-path="images/demo.gif" />
</Frame>
