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

# Elementor

> Install Superflow on Elementor, with a video walkthrough and step-by-step screenshots.

<Frame caption="Watch the full Elementor walkthrough">
  <iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/2OJ-Umsv29Q?si=zfjDV8leT9Mhfb2R" title="Install Superflow on Elementor" 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="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="Elementor: Enter Your Site URL" width="3736" height="1797" data-path="images/enter-url-final.png" />
    </Frame>
  </Step>

  <Step title="Select Other from the list of Platforms">
    Choose Other from the list of options to install Superflow with Elementor.

    <Frame>
      <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/select-other-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=7c3c214886072822ef45b84683444629" alt="Elementor: Select Other from the list of Platforms" width="3680" height="1765" data-path="images/select-other-final.png" />
    </Frame>
  </Step>

  <Step title="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="Elementor: Copy your unique Superflow code" width="3006" height="1457" data-path="images/copy-code-final.png" />
    </Frame>
  </Step>

  <Step title="Go to your Wordpress Dashboard, then click on Custom Code under Elementor">
    Go to your Wordpress Dashboard then click on Elementor in the side navigation.

    Next, click on Custom Code and then click Create New Custom Code to add your unique Superflow code

    <Frame>
      <img src="https://mintcdn.com/superflow/hdb1NqEMmtSslllh/images/settings-elementor-final.png?fit=max&auto=format&n=hdb1NqEMmtSslllh&q=85&s=e77d2667d07518841422c0f575966706" alt="Elementor: Go to your Wordpress Dashboard, then click on Custom Code under Elementor" width="3822" height="1875" data-path="images/settings-elementor-final.png" />
    </Frame>
  </Step>

  <Step title="Add Your unique Superflow Code">
    Create a new Custom Code title and paste in your unique Superflow Code

    <Frame>
      <img src="https://mintcdn.com/superflow/XWbQ_WnDAi9pqsmS/images/code-elementor-add-final.png?fit=max&auto=format&n=XWbQ_WnDAi9pqsmS&q=85&s=6e8f92d548029644f833122628b6ff71" alt="Elementor: Add Your unique Superflow Code" width="1714" height="1019" data-path="images/code-elementor-add-final.png" />
    </Frame>

    Be sure to change the location to `<Body> - End`.

    <Frame>
      <img src="https://mintcdn.com/superflow/gnnXgtB9B2DXpreO/images/elementor-body-final.png?fit=max&auto=format&n=gnnXgtB9B2DXpreO&q=85&s=933e095b93fd3f7dfcb15405fe48a1e1" alt="Elementor: Add Your unique Superflow Code" width="734" height="408" data-path="images/elementor-body-final.png" />
    </Frame>
  </Step>

  <Step title="Publish your Elementor site">
    Click the Publish button at the right of the page to publish your Elementor site.

    <Frame>
      <img src="https://mintcdn.com/superflow/uK-U8b-1fpW-Yhti/images/publish-elementor-final.png?fit=max&auto=format&n=uK-U8b-1fpW-Yhti&q=85&s=1b722b63862b32c6129531d1c462111f" alt="Elementor: Publish your Elementor site" width="780" height="702" data-path="images/publish-elementor-final.png" />
    </Frame>
  </Step>

  <Step title="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="Elementor: Verify your Installation" width="2998" height="1459" data-path="images/verify-final.png" />
    </Frame>

    If successful, you should be redirected to your published Elementor 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="Elementor: Verify your Installation" width="1366" height="1206" data-path="images/verified-final.png" />
    </Frame>
  </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 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?
  </Step>

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

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

  <Step title="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="Elementor: 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/XWbQ_WnDAi9pqsmS/images/demo.gif?s=013fcafea837a87dcad1c0d516e1ebee" alt="Elementor: Dropping your first comment" width="640" height="360" data-path="images/demo.gif" />
    </Frame>
  </Step>
</Steps>


## Related topics

- [Quickstart](/docs/quickstart.md)
- [Superflow Docs](/docs/index.md)
- [Video Library](/docs/watch.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.