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

# Quickstart

> Start building your awesome store in under 5 minutes

## Setup your Looop store

<Note>
  Looop store simply means a connection between a Webflow site and a Shopify store. Your account can have multiple stores, each Looop store will have a connection to one unique Webflow site and Shopify store.
</Note>

You need to have a Looop account to start building your store. If you don't have one, you can create one [here](https://manage.looop.com).

By default when you sign up, you will have a store created for you and you will be redirected to set up the integration with Webflow and Shopify.

### Setup steps

<AccordionGroup>
  <Accordion icon="link" title="Connect with Webflow & Shopify">
    <Steps>
      <Step title="Connect Webflow">
        Once you create a new store in Looop, you will be redirected to set up the connection with Webflow. Click the `Connect` button and you will be redirected to Webflow to authorize the connection with Looop.
      </Step>

      <Step title="Connect Webflow Site">
        After connecting with Webflow choose the Webflow site you want to connect with Looop.
      </Step>

      <Step title="Connect Shopify">
        After you have connected with Webflow, you will be redirected to set up the connection with Shopify.

        <Steps>
          <Step title="Create a custom private app">
            You need to create a custom private app in Shopify to get the API keys. You can follow this [guide](/essentials/shopify-setup#step-1-create-a-private-app-in-shopify) to create a custom private app in Shopify.
          </Step>

          <Step title="Configure Admin API scopes">
            You need to configure the Admin API scopes to make sure Looop has access to the data it needs to get from Shopify. You can follow this [guide](/essentials/shopify-setup#step-2-configure-api-scopes) to configure the Admin API scopes.
          </Step>

          <Step title="Configure Storefront API scopes">
            You need to configure the Storefront API scopes to enable the development of a headless storefront. You can follow this [guide](/essentials/shopify-setup#step-2-configure-api-scopes) to configure the Storefront API scopes.
          </Step>

          <Step title="Get your Shopify domain">
            Enter the `.myshopify.com` domain of your Shopify store. You can find this in your Shopify admin panel. You can follow this [guide](/essentials/shopify-setup#step-4-get-the-shopify-store-url) to get your Shopify domain.
          </Step>
        </Steps>
      </Step>
    </Steps>
  </Accordion>

  <Accordion icon="database" title="Configure CMS">
    <Steps>
      <Step title="Check CMS fields">
        Looop creates products, variants, collections, and options CMS and multiple fields in your Webflow site. However, reference and multi-reference fields are not created by default. You need to create these fields to make sure the CMS is ready to get data from Shopify.
      </Step>

      <Step title="Using CMS Verifier">
        Go to `Dashboard > Webflow Setup` to find the CMS structure and use the CMS verifier to check if your CMS is ready to get data from Shopify. You can also use this [doc](/essentials/webflow-cms) to see all the fields you need in Webflow CMS.
      </Step>
    </Steps>
  </Accordion>

  <Accordion icon="box" title="Import Shopify data">
    Once you have completed the CMS configuration, your Webflow site is ready to get data from Shopify. In the Looop dashboard, you will see three tabs `Products`, `Collections`, and `Policies`. In each tab you will see a `Sync` button next to each item. Click on the `Sync` button to import the data from Shopify to Webflow.
  </Accordion>
</AccordionGroup>

### Deploy your changes

<AccordionGroup>
  <Accordion icon="code" title="Add the Looop Embed">
    <Steps>
      <Step title="Get the Embed Script">
        Get the uniqe embed script for your store from the Looop dashabord. You can find the embed script in the `Looop Dashabord > Store Settings > Looop Embed` tab.
      </Step>

      <Step title="Paste the code in <Head>">
        Go to `Webflow Project Settings > Custom Code > Head` and paste the scipt in the head section of your Webflow site.
      </Step>
    </Steps>
  </Accordion>

  <Accordion icon="paintBrush" title="Develop in Webflow">
    Once your Shopify data is imported to Webflow, you can start developing pages in Webflow and than use Looop attributes avilable in our [Webflow designer app](/designer-app) to add ecommerce functionality to your site. You can follow this [guide](/webflow) to see how to use Looop attributes to add ecommerce functionality to your site.
  </Accordion>

  <Accordion icon="rotate-right" title="Setup Shopify Redirect">
    We want to make sure that any one who visits our shopify domain is redirected to our Webflow site. You can follow this [guide](/essentials/shopify-redirect) to setup the Shopify redirect.
  </Accordion>

  <Accordion icon="rocket" title="Deploy your site">
    Once you have added the Looop embed and developed your site in Webflow, you can deploy your site to the Webflow hosting. Looop Embed will connect your Webflow site with Shopify and you will be able to see the data from Shopify in your Webflow site.
  </Accordion>
</AccordionGroup>
