Before you start
- Your snippet from Websites in the Pidge inbox.
- If you can't add a script, your plan may not include custom code. Framer's pricing page lists which plans do.
<script>window.$pidge = []; window.PIDGE_WEBSITE_ID = "YOUR-WEBSITE-ID";</script> <script src="https://app.pidge.chat/client/l.js" async></script>
Your own copy is in the Pidge inbox under Websites, in Code for your website, with your website ID already filled in. Copy it from there.
Add the snippet
- Open your project's settings. Framer's help calls them Project Settings.
- Choose the Custom Code tab on the left.
- Click Add Script. If you've added scripts before, click the + icon.
- Name it, like "Pidge chat", and paste the snippet.
- Place it at the end of the body. The head works too.
- Don't limit it to certain pages, so it runs on all of them.
- When asked how often it runs, choose Once.
- Publish the site.
List your domains in Pidge
The chat only connects on domains you've listed for the website. In the inbox, open
Websites and put each domain on its own line in
Domains. Subdomains are included, so example.com also
covers www.example.com.
Add your custom domain. If people also visit the site on its free Framer address, add that full address too. You'll find it with your domains in the project settings.
Check that it works
- Open the published site in a private window. Framer doesn't run custom code on the canvas or in its preview.
- The chat bubble should be in the bottom corner. Send yourself a message and answer it from the inbox.
- In the inbox, the website's Not installed yet label goes away after the first visit from a listed domain.
If the bubble shows but the chat won't connect, the domain you're on isn't in the website's list in Pidge. If there's no bubble at all, the snippet isn't on the page, or the platform is still serving an older copy of it.
Framer's own guide: www.framer.com/help/articles/how-to-add-custom-code/
Other platforms
Stuck, or did a step look different on your screen? Tell us in the chat on this page.