Follow

Site Personalization Manager (SPM) Javascript: Simple Mode vs Custom Mode

Simple Mode

Note: Simple Mode handles most use cases for SPM and is built to work with most webpages - except Single Page Apps / sites with infinite scrolling.


Screen_Shot_2017-12-21_at_5.44.22_PM.png

Here is a screenshot of the expected behavior onsite when using Simple Mode :

- There should be at least one Sailthru SPM JS file loaded
- If loaded correctly, there should be at least one simple call request (with a visitor ID appended) fired automatically on the page:

Screen_Shot_2017-12-21_at_4.59.56_PM.png

Notice in the above Simple call, the section IDs are not specified. That is because the Page Setup and Page Element Setup fields in the SPM Section UI determine WHERE on the page should the section be called in. Simple Mode handles everything automatically - the sections to call in, the auto-tracking of the pageview, the click tracking as well as the impression counting.

Here is an example from a client section UI: 

Screen_Shot_2017-12-21_at_5.12.13_PM.png

Custom Mode

Note: Custom Mode is generally for Single Page Apps / Websites with infinite scroll


The only time(s) when Custom Mode is needed is if the pageview, click, or impression will need to be handled and called manually. In most cases, your website WILL NOT be required to use the Custom Mode. 

The only notable exception for Custom Mode implementation is if your website has infinite scroll or is a Single Page App. This implies that the page reload, section impression, etc. do not occur via traditional means and must be specified each time it happens.

A Single Page App (SPA) is defined as a web application or website that interacts with the user by dynamically rewriting the current page rather than loading entire new pages from a server. In essence, a page load only has to occur once.

On the other hand, a website with infinite scrolling is a website that uses the SPA infrastructure as a feed of continuous, "endless" content. SPAs can be either finite or infinite. 

Below is an example Custom Mode SPM JS tag with the required Sailthru.init() function containing the "isCustom": true parameter. The Sailthru.personalize() function and all the [optional] Sailthru.track() functions are listed following it:

Screen_Shot_2017-12-21_at_5.17.22_PM.png

Here is a screenshot of the expected behavior onsite when using Custom Mode :

- There should be at least one Sailthru SPM JS file loaded
- If loaded correctly, there will be at least two initialize calls (one GET and one OPTIONS)
- Two personalize calls are made (one GET and one OPTIONS). The personalize calls should have section-IDs appended to the end.
- An impression is fired, if the SPM-powered section is visible in the browser. If the impression is not appearing, keep scrolling on the page until the area of the section is visible.
- A pageview is fired if the user reaches a point on the page that signifies a pageview must be credited to the viewing URL (ie. the beginning or end of an article).

Screen_Shot_2017-12-21_at_3.40.38_PM.png




Top