Last updated 07/11/2025
Ninja Forms work out of the box for identifying users in Bread & Butter. Give it a try by entering a test submission on your form, and confirm that your name and email are captured in the Bread & Butter Dashboard.
If you’re not seeing it working, you can quickly and easily add the code snippets below.
Add the following to your form page, replacing the field names and form name to match your specific form:
document.addEventListener("DOMContentLoaded", (event) => { const _first_name = 'input[name="nf-field-5-textbox"]'; const _last_name = 'input[name="nf-field-6-textbox"]'; const _email = 'input[name="email"]'; const _form_button = '#nf-field-8'; let retry = 0; let loadForm = ()=> { let form_button = document.querySelector(_form_button); if (form_button) { form_button.addEventListener('click', async function(event) { await identifyUser(); }); } else if (retry++ < 3) { setTimeout(()=> { loadForm(); }, 1000); } }; let identifyUser = () => { return new Promise((resolve) => { let first_name = document.querySelector(_first_name).value; let last_name = document.querySelector(_last_name).value; let email = document.querySelector(_email).value; BreadButter.api.identifyUser(email, first_name, last_name, () => { resolve(); }); }); }; loadForm(); });
On submit, the user’s first name, last name, and email address will appear on your Bread & Butter Dashboard, identifying your users.
Don’t have separate first and last name fields on your form? Use the following:
document.addEventListener("DOMContentLoaded", (event) => { const _name = 'input[name="nf-field-5-textbox"]'; const _email = 'input[name="email"]'; const _form_button = '#nf-field-8'; let retry = 0; let loadForm = ()=> { let form_button = document.querySelector(_form_button); if (form_button) { form_button.addEventListener('click', async function(event) { await identifyUser(); }); } else if (retry++ < 3) { setTimeout(()=> { loadForm(); }, 1000); } }; let identifyUser = () => { return new Promise((resolve) => { let first_name = document.querySelector(_name).value.trim(); let email = document.querySelector(_email).value.trim(); let last_name = ""; if (first_name.indexOf(' ') > -1) { last_name = first_name.substr(first_name.indexOf(' ') + 1); first_name = first_name.substr(0, first_name.indexOf(' ')); } BreadButter.api.identifyUser(email, first_name, last_name, function(){ resolve(); }); }); }; loadForm(); });
Add the following to your form page, replacing the field names to match your specific form:
document.addEventListener("DOMContentLoaded", (event) => { const _name = 'input[name="nf-field-5-textbox"]'; const _email = 'input[name="email"]'; BreadButter.getProfile((profile) => { let name = ""; if (profile) { name = (profile.first_name ? profile.first_name : "") + " " + (profile.last_name ? profile.last_name : ""); name = name.trim(); } if (name) document.querySelector(_name).value = name; if (profile && profile.email_address) document.querySelector(_email).value = profile.email_address; }); });
When signed in users go to your form, their name and email address will be automatically entered.
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