Full Docs

EXISTING FULL DOCS

---

---

Proposed new doc additions below...

Adding details for un-merged personalization PR.

---

Favorites

Managed Favorites

Force some user properties to be dynamically controlled by user behavior tracking of hits to taxonomy tagged pages. You'll need to specifically call out which user properties can be updated this way and by which favorites.

Example Configuration

groucho.config.favorites = [{
    userProperty: 'user.genre',
    favoritesKey: 'music_genre',
    overwrite: true
  }, {
    userProperty: 'user.role',
    favoritesKey: 'audience_type',
    overwrite: false
}];

Details

• userProperty - localStorage value to adjust automatically.
• favoritesKey - Tag vocabulary to discover favorites.
• overwrite - Should favorites overwrite existing values (used if value can be set by user).

Personalization / Adjustment

You can easily filter and/or reveal content based on each users' personal preferences. You are essentially referencing localStorage values to choose what's visible. Use markup to denote Groucho adjustment panes and which user properties (or params) to check. Mark variations corresponding user (or param) values.

Example Adjustments

Wrapper around several variations...

<section data-groucho-adjust="user.genre">
  <span data-groucho-variant="pop">Gaga</span>
  <span data-groucho-variant="rock">Zeppelin</span>
</section>

<a data-groucho-adjust="user.leadStatus" data-groucho-variant="customer" href="/order-history">Past Orders</a>

Groucho will find adjustment panes and process each element with a groucho data attribute.

Note: The markup allows for both initially hidden and initially shown panes and elements. It's recommended to include a CSS rule like [data-groucho-adjust].hidden { visibility:hidden } as this library is purely JS. Using visibility vs display is preferred to avoid reflow as data is discovered.

Param Overrides

Force specific user preference personalization with URL param overrides. This allows ensuring specific page element visibility regardless of user values, as well as adjusting pages when the no user preferences exist yet.

Example URL

http://www.example.com/my-page?music=pop&campaign=summer

Example Configuration

groucho.config.adjust = [{
    userProperty: 'user.genre',
    urlParameter: 'utm_genre',
  }, {
    userProperty: 'user.leadSource'
    urlParameter: 'utm_campaign',
}];

Quick Wins

Discover how many pages a user has visited on your site.

function getPageCount() {
  return groucho.getActivities('browsing').length;
}