Installation Guides

Getting your Webflow site talking to your Bread & Butter IO account is easy when you follow these steps.

Getting started with Bread & Butter - Modern analytics

IMPORTANT - You must add the initialization script tag to get started. This page is a step-by-step guide to add the script tag to you Webflow site.

The script tag will enable analytics, and is required for you to add any other Bread & Butter functionality to your Webflow website.

When you created your Bread & Butter account you would have been given an App ID. You need this App ID so your Webflow site can securely communicate with your Bread & Butter app. Don’t have an account yet? See How to Create an Account/App.


How it works

Bread & Butter code snippets can be added to your Webflow website using Custom Code in the header. Adding the code snippets to the Custom Code head tag applies them to every page on your website.

Step 1
On your Webflow Dashboard, click on the 3 dots at the bottom right of your project. Then, select Settings.

Step 2
Select the Custom Code tab.

Step 3
In the Head Code field, paste in the following script tag:

<script>
window.initBreadButter = function () {
    // Here is your configuration of the BreadButter App.
    BreadButter.configure({
        app_id: "[APP_ID]"
    });
};
(function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) { return; } js = d.createElement(s); js.id = id; js.src = 'https://cdn.breadbutter.io/dist/breadbutter.6.0.0.653.min.js'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'breadbutter-js'));
</script>

Step 4
Then, replace [APP_ID] with your App ID from your Bread & Butter App. Not sure how to get your App ID? Log in to Bread & Butter: https://app.breadbutter.io/sign-in/ Then, click on App Settings in the left menu. Your App ID will be at the top of the page.


Step 5
Click Save Changes.
Publish your website, when ready.


Congratulations! Your website is now set up for Bread & Butter Analytics. Head to your Bread & Butter dashboard to see all of the users visiting your website.

Not seeing any activity? Open up your website in a browser, and see if your visit appears in the Dashboard. If you're still not seeing your activity appear, check the following:

- Ensure that your App ID in the script tag is correct.
- In the App Settings page in Bread & Butter, make sure your website is in the CORS Allow List.