All Collections
Frequently Asked Questions
How do I add custom classes to enable website personalization?
How do I add custom classes to enable website personalization?
Rodrigo Fuentes avatar
Written by Rodrigo Fuentes
Updated over a week ago

ListenLoop's Website Personalization uses a JavaScript tag that scans your website for HTML classes, such as "ll-custom-1", to identify what content you want to customize for a target account.  For example, if you want to customize an <h1> element on your website, you can tag it like this:

         <h1 class=”ll-custom-1”>Hello World</h1>

You may add up to 5 custom classes to a webpage you want to personalize:

  • ll-custom-1

  • ll-custom-2

  • ll-custom-3

  • ll-custom-4

  • ll-custom-5

Note, the Website Personalization will inject content (including HTML) inside of an HTML element, rather than replace the tagged class.  

Suppose you have the following content in your spreadsheet for an account: 

         ll-custom-1 = “<span style=’font-size: 30px;’>BIG Hello World</span>”

The output on your website will inject inside of the <h1> class, like this: 

         <h1 class=”ll-custom-1”>
         <span style=’font-size: 30px;’>BIG Hello World</span>
         </h1>

It will not "replace" the <h1> the element as shown in this example:

         <span style=’font-size: 30px;’>BIG Hello World</span> 

Watch this tutorial video between 01:00 to 02:00 for more details:

Did this answer your question?