> ## Documentation Index
> Fetch the complete documentation index at: https://superflow-claude-superflow-portal-docs-78gpp8.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Webflow Marketplace App

> Install Superflow with the Webflow Marketplace App, with a video walkthrough and step-by-step screenshots.

<Frame caption="Watch the full Webflow Marketplace App walkthrough">
  <iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/oRcVg_0bMfQ?si=BCs9SVL5zAciIr0M" title="Install Superflow on Webflow Marketplace App" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowFullScreen />
</Frame>

<Tip>
  Prefer to read? Every step in the video is written out below, with a screenshot for each one.
</Tip>

<Steps>
  <Step title="Go to the Superflow app on the Webflow Marketplace">
    Navigate to the Superflow app on the Webflow Marketplace by going to [this link](https://webflow.com/apps/detail/superflow?category=productivity-language).
  </Step>

  <Step title="Click '+ Add to Site'">
    Click on `+ Add to Site` in the top right corner

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-2.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=02de125fd550931e77d61fe3ce2678ea" alt="Webflow Marketplace App: Click '+ Add to Site'" width="3712" height="1789" data-path="images/webflow-integration-2.png" />
    </Frame>
  </Step>

  <Step title="Select the sites you want to add Superflow to">
    Select the Webflow sites you want to add Superflow to.

    Then click Authorize App.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-3.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=6427f1049d87a15e9d77f8fee832579a" alt="Webflow Marketplace App: Select the sites you want to add Superflow to" width="1506" height="1754" data-path="images/webflow-integration-3.png" />
    </Frame>
  </Step>

  <Step title="Create a Superflow Account">
    If you haven't created a Superflow account, enter an email or log in with Google.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-4.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=e0663dbddcb626afca838ba7a0a467d0" alt="Webflow Marketplace App: Create a Superflow Account" width="1288" height="1404" data-path="images/webflow-integration-4.png" />
    </Frame>
  </Step>

  <Step title="Verify that Superflow has been installed">
    Click the Verify Install button to verify that Superflow was installed correctly on your Webflow site.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-5.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=9bcee0271e8ac7c34082047444ea59fa" alt="Webflow Marketplace App: Verify that Superflow has been installed" width="1214" height="1028" data-path="images/webflow-integration-5.png" />
    </Frame>

    If successful, you should be redirected to your published webflow site and see the Superflow toolbar in the bottom right corner.
  </Step>

  <Step title="Troubleshooting">
    Having trouble getting your verifying your installation? Here are the common mistakes users encounter when installing Superflow:

    * 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?
  </Step>

  <Step title="Navigate to your Webflow site">
    Now that you have verified that Superflow has been installed on your Webflow site, navigate to your published site and add `?review=true` at the end of the URL to enable Superflow.

    `Example: mywebsite.webflow.com/?review=true`
  </Step>

  <Step title="Test out Superflow">
    You should now see a Superflow toolbar on the bottom right of your screen.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/toolbar-final.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=b492072e934939d1335584a8efdeba6a" alt="Webflow Marketplace App: Test out Superflow" width="3678" height="1775" data-path="images/toolbar-final.png" />
    </Frame>
  </Step>

  <Step title="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-claude-superflow-portal-docs-78gpp8/_zKrRwh5L1PapanY/images/demo.gif?s=f8a9dd8577b5ee8929ed7dd7e34658fb" alt="Webflow Marketplace App: Dropping your first comment" width="640" height="360" data-path="images/demo.gif" />
    </Frame>
  </Step>

  <Step title="Test out the Superflow extension on the Webflow Site Designer">
    To access the Superflow extension, go to your Webflow site's designer section and click on the Apps button on the side menu.

    Then hover over the Superflow app and click Launch.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-6.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=887d8c1247935d24cbed84c8ec190f8c" alt="Webflow Marketplace App: Test out the Superflow extension on the Webflow Site Designer" width="772" height="1780" data-path="images/webflow-integration-6.png" />
    </Frame>

    After that, you can see all existing comments on your site by clicking on Review Comments.

    <Frame>
      <img src="https://mintcdn.com/superflow-claude-superflow-portal-docs-78gpp8/g2KY_MNTB5LdaNY9/images/webflow-integration-7.png?fit=max&auto=format&n=g2KY_MNTB5LdaNY9&q=85&s=a76b8fc9298105b5fd67ffaee41c4463" alt="Webflow Marketplace App: Test out the Superflow extension on the Webflow Site Designer" width="1030" height="1358" data-path="images/webflow-integration-7.png" />
    </Frame>
  </Step>
</Steps>
