Last updated 02/16/2024
Before adding the ‘Sign up / Sign in’ tool make sure you have added the initialization script tag.
The ‘Sign up / Sign in’ tool allows you to add a Sign Up / Sign In & Sign Out button anywhere on a webpage, or in your webpage header.
When a user converts and authenticates with their favorite account, the tool changes to display their profile picture from their account, plus the option to sign out.
The ‘Sign up / Sign in’ tool is added by placing a <div />
element where you want it, then updating the Bread & Butter script tag to reference it.
Find the initialization script you have added to your webpage (see initialization script if you have not added it already)
<div />
element to the location on your page where you want the 'Sign up / Sign in' tool to appear. Most customers place it in their website header, so that it appears on all pages.id
attribute to the <div />
of "bb-profile-widget"
<div id="bb-profile-widget" />
In the initialization script, find the line:
BreadButter.configure({app_id: "[APP_ID]"});
Add the following line under BreadButter.configure();
BreadButter.ui.addProfileWidget('bb-profile-widget');
The 'Sign up / Sign in' tool will now appear at the top of all of your pages, and show the user their account information when logged in.
Don’t use Bread & Butter? Want to learn more about how Bread & Butter solves the four biggest problems facing marketers today? Book a demo and see how Bread & Butter is helping marketers make the most of their first-party data
Add authentication & API event tracking to your website/app with a script tag & configuration