# Install the Robylon Chatbot on a Webflow Site

Add the Robylon chatbot to your Webflow site by pasting the snippet into a page's custom code, then publishing.

> Source: https://www.robylon.ai/docs/chatbot/install/webflow
> Section: Chatbot

To add the Robylon chatbot to a Webflow site, copy the chatbot's snippet from Robylon and paste it into the custom code of each page where it should appear. You need designer access to the Webflow site.

## How do I copy the chatbot snippet from Robylon?

Go to **Settings → Channels → Chatbot**, click your chatbot, open the **Install** tab, choose **Web → Webflow**, and copy the snippet. It already contains your Chatbot ID. See [Installation](https://www.robylon.ai/docs/chatbot/installation) for what the snippet does.

## How do I add the chatbot to my Webflow site?

Paste the snippet into the page's custom code, then publish.

<Steps>
  <Step title="Open the site in the Designer">
    Sign in to Webflow, hover over your site and click **Open in Webflow**.

    <Frame>
      <img src="/assets/docs/webflow-1.webp" alt="Webflow dashboard with the site to add the chatbot to" width="1554" height="804" />
    </Frame>
  </Step>
  <Step title="Open the Pages panel">
    Click the **Pages** icon in the left toolbar of the Designer.

    <Frame>
      <img src="/assets/docs/webflow-2.webp" alt="Webflow Designer with the Pages panel icon in the left toolbar" width="1560" height="750" />
    </Frame>
  </Step>
  <Step title="Open the page settings">
    Hover over the page you want and click its settings (gear) icon.

    <Frame>
      <img src="/assets/docs/webflow-3.webp" alt="Webflow Pages panel with the settings icon for the Home page" width="1592" height="776" />
    </Frame>
  </Step>
  <Step title="Paste the snippet">
    Scroll to **Custom Code** and paste the Robylon snippet inside the `<head>` tag field. Save.

    <Frame>
      <img src="/assets/docs/webflow-4.webp" alt="Webflow page settings Custom Code section where the snippet goes in the head tag" width="1577" height="807" />
    </Frame>
  </Step>
  <Step title="Publish and test">
    Publish to your staging domain, check that the chatbot launcher appears and answers a test message, then publish to production.

    <Frame>
      <img src="/assets/docs/webflow-5.webp" alt="Webflow publish menu with staging and production domains" width="1912" height="868" />
    </Frame>
  </Step>
</Steps>

<Tip>
To show the chatbot on every page, paste the snippet once in **Site settings → Custom code → Head code** instead of on each page.
</Tip>

<Frame>
  <img src="/assets/docs/webflow-6.webp" alt="Webflow site with the chatbot launcher in the bottom right corner after publishing" width="1889" height="836" />
</Frame>

If the launcher does not appear, see [How do I know the chatbot is installed correctly?](https://www.robylon.ai/docs/chatbot/installation#how-do-i-know-the-chatbot-is-installed-correctly)
