If you want to segment shoppers based on browsing behavioral events or customer attributes, you can use our Javascript based Visit Custom Event targeting option.
Once segmented, you can serve them with specific experiences onsite through Nosto's Onsite Content Personalization and Onsite Product Recommendations.
In this article, you will learn through a concrete use case how to segment shoppers using our Visit Custom Event targeting option and how to create a different onsite shopping experiences for these segments.
The shopping experiences
For visitors landing on the online store for the first time, we will display a self-segmentation campaign in form of a full screen overlay offering them to live a specific experience if they explicitly want to discover Woman's products or Man's products. Note that as an alternative, the same campaign could look like a more minimal pop-up or an embedded banner for example.
Example of campaign by Pull & Bear
When shoppers interact with either the Woman's banner or the Man's banner, they are redirected to two different versions of the website.
Experience for shoppers interested in Woman's products
Experience for shoppers interested in Man's products
The set-up - How to create the relevant segments?
Under Segmentation & Insights in the Nosto Admin Panel, you need to create two Custom segments:
One custom segment that will be used to serve an experience for shoppers who will want to discover Woman's products.
One custom segment that will be used to serve an experience for shoppers who will want to discover Man's products,
When creating a Custom segment, you need to choose the third targeting option under Customer Attributes, which is Visit Custom Event.
When selected, it adds the targeting option to the wizard and you have to define the custom strings relevant to each of the two segments we are creating.
The custom strings are manually defined and must be unique to each segment. Here are the two custom strings that we will define with the segment creation wizard when selecting Visit Custom Event as a targeting option:
Custom string defined for the snippet that will include shoppers who will want to discover Woman's products:
<script>nostojs(function(api){api.addSegmentCodeToVisit("Woman")})</script>
Custom string defined for the snippet that will include shoppers who will want to discover Man's products:
<script>nostojs(function(api){api.addSegmentCodeToVisit("Man")})</script>The snippets are automatically generated when you define the custom strings:
Custom string defined
Once the two segments are created, they are listed in the Segment listing view as such:
At this stage, no shopper is included in these two segments. It leads us to the second step of the implementation, which is creating the full screen overlay campaign and start segmenting the shoppers to the relevant segments depending if they click on the Woman's banner or on the Man's banner.
The set-up - How to create a Side-by-side Overlay campaign?
Under Onsite Content Personalization in the Nosto Admin Panel, you need to create a campaign in form of a full screen overlay with two side-by-side images. One representing the Woman's catalogue, one representing the Man's catalogue.
As an example, you can find the code of a Side-by-side Overlay campaign here.
Designed as part of the campaign itself, the relevant Javascript calls will be triggered onclick when shoppers click on the corresponding banners. A click on the Woman's banner triggers the corresponding Woman's Javascript call and a click on the Man's banner triggers the corresponding Man's Javascript call.
You can explore the events in details here.
Additionally, a reload function is initiated on the back of a click (precisely here). This forces the Nosto embed script to reload to correctly track if a shopper must be included in a segment or not. In this example, the whole page would be reloaded so it's not necessarily needed. However, this is a recommended procedure whenever Visit Custom Events are used to create segments. If the Nosto embed script is not proactively reloaded, Nosto only catches the information upon the next page load on the site.
More information about reloading the Nosto's embed script here.
The set-up - How to create Woman's experience and the Man's experience
Now that the segments are created and the Side-by-side Overlay campaign is created, you're almost set up.
You now need to design the campaigns you will want to expose to shoppers who want to discover Woman's products and the ones who want to discover Man's products.
For the sake of simplicity, let's say that one Hero Banner will be used for the Woman's experience and one Hero Banner for the Man's experience.
Summary
You can use the Nosto's Experience Overview to define which campaigns will be exposed to the relevant segments of shoppers once you have defined in which placements they must be injected. You can learn more about Nosto Placements here.
Let's summarize the set-up:
The Side-by-side Overlay campaign will be exposed to First-time Visitors only (a Nosto's Automated Lifecycle Segment)
The Woman's Hero Banner will be exposed to the First-time Visitors who select Woman (a custom segment created using a Javascript Visit Custom Event targeting option)
The Woman's Hero Banner will be exposed to the First-time Visitors who select Man (a custom segment created using a Javascript Visit Custom Event targeting option)
Below is a visual summary of the set-up using a Who, What and Where framework:
The next steps
As shoppers evolve throughout their first visit and browse category-specific products or search for some specific product lines, you can use other Nosto' specific Behavioral Affinities targeting options to personalize even further the shopping experience when the shoppers will revisit the website.
For example, if a woman search actively for Pants only and disregard other categories, she can be welcomed with an experience showing more prominently Pants imageries and introducing complementary product lines through mini-banners.
The above is an illustrative example. If you want more information about our personalization capabilities, please do not hesitate to contact Nosto!