Personalization

Tell personalized story at scale

Tokens are perfect to quickly personalize your demo at scale. You can:

Read below to learn more about how content can be personalized in different ways.

Personalize Guided Steps

You can also personalize your guided step content with "Text Tokens". When personalized content is provided, your prospects will be able to relate to your demos even better.

Try the Interactive Demo Yourself πŸ‘‡

Personalize HTML Screens

Text Tokens

You can edit the captured HTML screens and insert dynamic text tokens to personalize the demo content.

  • Click on any text element in the captured screen

  • Then, select "Insert Text Token" to add your token

  • Configure multiple tokens for your account by clicking on "Manage Fields". You can also assign a 'default' value as a fallback option.

Try the Interactive Demo Yourself πŸ‘‡

Date/Time Tokens

You can also insert more real-time data or time data in your captured HTML screens.

  • Click on the element where you would like the current date or time to be shown

  • Insert the date/time format you need.

Read more about formatting options and how you can add/subtract dates

Try the Interactive Demo Yourself πŸ‘‡

Image Tokens

You can dynamically swap out logos or images in your demo before sharing them with prospects.

  • Click on any image element and choose "Assign Image token."

  • Create a new token or choose an already existing token

  • Assign 'Default' image for fallback

  • If your image or logo is present on other pages, then choose to match "All Screens" (Storylane automatically detects the same element logo and updates all with a token, so you don't need to do it on each screen)

Try the Interactive Demo Yourself πŸ‘‡

Personalize from Lead Form data

When using a native Storylane lead form

When you use Storylane Lead Form, below token variables are automatically created for you.

  • {{email}}, {{first_name}}, {{last_name}}, {{name}}

  • You can use the above tokens in your guided steps to personalize the experience

Try the Interactive Demo Yourself πŸ‘‡

When using a custom lead form

If you are using your custom lead form (e.g., Hubspot, Marketo, Pardot, etc.), then you will need to pass the form data through a cross-origin message so that tokens can be assigned.

Below is a sample code snippet showing how data will be sent:

// sample code where tokens "first_name" and "last_name" are assigned
window.parent.postMessage({
  message: 'storylane-token-submit',
  payload: {
    token: {first_name: "John", last_name: "Doe"}
  }
},'*');

Example with Hubspot Form:

// sample code where tokens "first_name" and "last_name" are 
// assigned by fetching data from HubSpot form

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
   hbspt.forms.create({
    region: "na1",
    portalId: "######",
    formId: "######-######-######-######-######",
       onFormSubmit: function($form) {
           $hs_fname = $form[0].first_name.value;
           $hs_lname = $form[0].last_name.value;
           window.parent.postMessage({
	 	message: 'storylane-token-submit',
		payload: {
		 	token: {first_name: $hs_fname, last_name: $hs_lname}
		}
	   },'*');
       }
  });
</script>

Example with Marketo Form

// sample code where tokens "first_name" and "last_name" are 
// assigned by fetching data from Marketo form

<script src="//test.storylane.io/js/forms2/js/forms2.min.js"></script> 
<form id="mktoForm_####"></form> 

<script>
MktoForms2.loadForm("//test.storylane.io", "###-####-####", ####, function(form) {
   // Add an handler 
   form.onSuccess(function(){
         var vals = form.vals();
         window.parent.postMessage({
	 	message: 'storylane-token-submit',
		payload: {
		 	token: {first_name: vals.first_name, last_name: vals.last_name}
		}
	 },'*');
    });
});
</script>

Personalize from URL params

You can personalize your demo content through URL query parameters. Once you have 'Text tokens' set up then you can build different demo URLs by encoding the token values as URL params.

Let's say you have 3 tokens set up in your demo ("first_name", "last_name", "company_name"), then you can build your demo URL with data like below:

https://app.storylane.io/share/jdelklbymyyr?token[first_name]=Jane&token[last_name]=Smith&token[company_name]=Acme

When the above demo URL is opened then it will be automatically personalized with the token values passed in URL params.

Passing data from CRM or Marketing Automation platform

You can also pass data from your CRM or marketing platforms as token values in URL params

Hubspot - see the resource here on how Hubspot contact data can be used as token values

Here is an Example for the above URL:

https://app.storylane.io/share/jdelklbymyyr?token[first_name]={{contact.firstname}}&token[last_name]={{contact.lastname}}&token{company_name}={{contact.company}}

Marketo - resource here on how Marketo data can be used as token values

https://app.storylane.io/share/fvzglsvinxb8?email={{lead.Email Address:default=noemail}}

Pardot - resource here on how Pardot data can be used as token values

https://app.storylane.io/share/fvzglsvinxb8?email={{Recipient.Email}}

ActiveCampaign - resource here on how ActiveCampaign data can be used as token values

 https://app.storylane.io/share/fvzglsvinxb8?email=%EMAIL%

Lemlist - resource here on how Lemlist data can be used as token values

https://app.storylane.io/share/fvzglsvinxb8?email={{email}}

Last updated