Hyper-personalization

Last updated 01/26/2026

Before adding the hyper-personalization, make sure you have added the initialization script tag.

With this feature, you can replace generic content with a personalized message that users only see once they have converted. For example, on your homepage, you can mention the user by name:

To add the personalized text like your logged in user’s name to any element on the page, you just need to follow these few steps:

Step 1

On the page you want to do hyper-personalization, add the following JavaScript:

    BreadButter.ui.applyText('FIELD_ID', "TEMPLATE", {
        type: 'TYPE'
    });

Step 2

  • Replace FIELD_ID with the ID of the HTML element you would like to personalize.

  • Replace TEMPLATE with the new text that you want to appear when a user authenticates. You can use plain text or html, which must be specified in the TYPE below. The available customization fields are:

    %FIRST_NAME%

    %LAST_NAME%

    %NAME%

    %EMAIL%

    Note: This will replace all of the text in the HTML element.

  • Replace TYPE with the content type: either 'html' or 'text'. Use 'text' if the content is just plain text. Use 'html' if you have included HTML tags in the TEMPLATE content.

Step 3

Users should now see the personalized text once they have signed in to your site.

Repeat the above steps for any other pages that you would like to personalize.