Account Widget
Want visitors to be recognised every time they come back? The Account Widget adds an account button to your website. Visitors who haven't raised a hand yet can click it to open Instant Lead Capture. Visitors who have see their picture and name on the button, on every page and every visit.
In short: The Account Widget is an account button for your website, usually in your header. A visitor who hasn't raised a hand yet clicks it and Instant Lead Capture opens. Once they've raised a hand, the button shows their picture, and clicking it shows their details and a Sign out option. It remembers which account each visitor used last time, so coming back is quick. On WordPress you turn it on in the plugin, for every page or page by page, and choose where it docks on the screen. On any other website you add it with an empty element and one line in your Bread & Butter snippet.
How it works
The Account Widget adds an account button to any or all pages of your website. Visitors who haven't raised a hand yet see a Sign up / Sign in button, which opens Instant Lead Capture when clicked. Once they've raised a hand, they're recognised across visits, and the button shows their profile picture. Clicking it shows their details and a Sign out option.
Why use the Account Widget
- Fits your navigation. Add the account button to your existing website or app header.
- One click either way. Visitors raise a hand, or leave, with a single click, so they stay in control.
- Remembers how they came in. The widget remembers which account each visitor used before, so returning visits are quick.
- Your layout. On WordPress, dock the widget to a corner of the screen and set its exact distance from the edge in pixels.
Set up the Account Widget on WordPress
- In your WordPress admin, click Bread and Butter in the left menu.
- In the left menu, expand More Tools and select Account widget.
- Select Enable for all pages, then click Save. You can also use the position settings to choose where the widget docks on the screen.
Turn it on for specific pages only
If you'd rather show the Account Widget on certain pages only, set it up in the WordPress editor:
- Open the page or post in the WordPress editor.
- Click the Bread and Butter logo at the top right, or click the Options button and select Bread and Butter under Plugins.
- In the Account Widget section, enable the widget and set its position for that page.
- Publish the page to save your changes, and repeat for any other pages.
Not on WordPress? Add the Account Widget with a script
On any other website, you add the Account Widget by placing an empty element where you want it, such as in your header, and adding one line to the Bread & Butter snippet. The Bread & Butter snippet must already be installed (see JavaScript Snippet).
Step 1: Add a placeholder where the widget should appear
Add an empty element with the ID bb-profile-widget where you want the widget. Most sites put it in the header, so it appears on every page.
<div id="bb-profile-widget"></div>
On Webflow, drag a Div Block to that spot, click the gear icon in the right pane to open Element Settings, and set the ID to bb-profile-widget .
Step 2: Add the widget to the Bread & Butter snippet
In your Bread & Butter snippet, find this line:
BreadButter.configure({app_id: "[APP_ID]"});
Add this line directly below it:
BreadButter.ui.addProfileWidget('bb-profile-widget');
Step 3: Save and publish
Save your changes and publish your site. The Sign up / Sign in button now appears where you placed it, and shows each visitor's profile once they've signed in.