Page Method

Overview

The page method is used to track page views, creating Viewed Page events for users the function is called for. You should only trigger this method upon successful page loads or route changes in the case of single page applications. This method automatically sends gathers and sends information regarding the page, browser session and operating system configuration of tracked users to CrossEngage.

The page method has the following structure:

ce('track', 'Viewed Page')

Implementation

This page method is not needed on each page - only on those for which a specific use case might arise, e.g. sales-, special offer-, voucher-pages. You can leave out the page method on the product detail pages as the track method can be used instead.

1. Copy the page method snippet.

2. Create a custom HTML tag on your tag manager and paste the snippet between HTML tags.

3. Set up a trigger which fires the tag upon every page load.

Call the method each time you consider a new page is loaded.

If you are setting up the page method for a single page application, ensure that you set up the trigger based on routing changes rather than page loads.

Gathered data

The information the page method transmits is stored in a context object, which has a syntax similar to the example below:

{     
language: "en-US",     
languages: ["en-US", "en", "de"],     
location: "https://www.crossengage.io/TPS-Report/cover/",     
page: {         
    path: "/TPS-Report/cover/",         
    referrer: "https://www.crossengage.io/TPS-Report/",         
    search: "TPS",         
    title: "TPS Report",         
    url: "https://www.crossengage.io/TPS-Report/cover/"     
    },     
platform: "MacIntel",     
siteId: "www.initech.com",     
userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_1)" 
}

Use cases

Segment users that have visited the women shoes category of your shop

The below block is an example of a context object from a Viewed Page event which we will be targeting for this example:

{     
language: "en-US",     
languages: ["en-US", "en", "de"],     
location: "https://www.crossengage.io/TPS-Report/cover/",     
page: {         
    path: "/women/shoes/",         
    referrer: "",         
    search: "shoes",         
    title: "Women shoes",        
    url: "https://www.crossengage.io/women/shoes/"     
    }, 
platform: "MacIntel",     
referrer: "",     
siteId: "www.crossengage.io",     
userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_1)" 
}

To segment all users that have visited the women shoes category of your shop, create a segment condition filtering Viewed Page events with the property context.page.path using the contains operator with the value women/shoes.

Segment users that have visited the FAQ section of your site

The below block is an example of a context object from a Viewed Page event which we will be targeting for this example:

{     
language: "en-US",     
languages: ["en-US", "en", "de"],     
location: "https://www.crossengage.io/faq/",     
page: {         
    path: "/faq/",         
    referrer: "",         
    search: "frequently asked questions",         
    title: "FAQ",         
    url: "https://www.crossengage.io/faq/"     
    },     
platform: "MacIntel",     
referrer: "",     
siteId: "www.crossengage.io",     
userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_1)" 
}

To segment all users that have visited the FAQ section of your site, create a segment condition filtering Viewed Page events with the property context.page.title using the contains operator with the value FAQ.

Depending on the use case you would like to satisfy, you may use any of the properties sent in the context of the Viewed Page event or even a combination of them. For example, you may want to segment all users which have visited your FAQ page, redirected from google. To segment these users, create a segment condition filtering Viewed Page events with the property context.page.referrer using the contains operator with the value google and the property context.page.title using the contains operator with the value faq.