Google Analytics 4 Page Types in Data 360
Use the Data 360 Website Connector and Google Analytics 4 (GA4) to automatically track real-time user engagement by Page Type.
| Available in: |
|---|
| Data Cloud, Marketing Cloud Personalization |
| Task | Permission |
|---|---|
| Configure Web SDK Integration | Data Cloud Admin OR Marketing Cloud Personalization Salesforce admin |
Use the Page Type feature with the Salesforce Web SDK to capture page-specific metadata via Google Analytics 4 (GA4) and Google Tag Manager (GTM). By pushing a pageType object and contextualAttributes to a custom data layer called sfWebInteractionsDataLayer, the Salesforce Web SDK’s GA4 module automatically identifies and tracks the context of a user’s site navigation.
Use these key capabilities of the feature to:
- Standardized Context Mapping: Categorize diverse URL structures into unified page types.
- Seamless GA4/GTM Interoperability: Leverage your existing Google Tag Manager logic to push page type data.
- Single-Page Application Support: Support Multi-Page Applications (MPA) and Single-Page Applications (SPA) by listening for a data layer object push.
To push to the data layer, call sfWebInteractionsDataLayer.push() with a page type object. You call sfWebInteractionsDataLayer.push() when an event invokes a trigger (such as a page navigation event). Add the sfWebInteractionsDataLayer.push() code to GTM with a custom HTML tag that specifies the appropriate trigger.
Configure GTM to push page type and contextual attribute data to the Salesforce Web SDK. Create a GTM script that pushes a configuration object to the sfWebInteractionsDataLayer.
| Field | Type | Required | Example | Description |
|---|---|---|---|---|
| pageType | string | Yes | cart | Defines the current page; see Salesforce Page Types. |
| contextualAttributes | object | No | {...} | Provides extra metadata related to the specific page context. |
| sendEvent | boolean | No | true | Sends a page_view event to Data 360; see GA4 Event Mapping. |
Provide the configuration as an argument to the sfWebInteractionsDataLayer.push() method. Enclose this method inside a <script> tag. For example:
In Google Tag Manager:
- Go to your workspace and create a tag.
- Under Tag configuration, select Custom HTML.
- Paste your
sfWebInteractionsDataLayer.push()method into the code editor. Enclose the method in a<script>tag. - Configure one or more triggers to push this tag on your page. Use History Change for Single-Page Application triggers.
Page Types establish what pages on a website and what data on those pages you want Data 360 to track. You can apply a single pageType configuration to multiple pages on your website.
Map page types depending on your business vertical, the objective of your website, and the type of content your website serves.
You can define these general page types on any website.
| Page Type | Description |
|---|---|
home | The website's homepage |
blog | The blog's main index or homepage |
blog_detail | A specific blog post or article page |
search | The initial search entry page |
search_results | The page showing search query results |
register | The user account registration page |
sign_in | The user login page |
account | The user's account overview or profile page |
error_page | A landing page for errors (for example, 404 Not Found) |
You can define these page types for a commerce website.
| Page Type | Description |
|---|---|
product_detail | A product detail page |
brand | A brand detail page |
department | A department overview page |
category | A category page, sometimes referred to as a product list page |
cart | The shopping cart |
checkout | The checkout pages |
order_confirmation | The order confirmation page |
You can define these page types for a B2B website.
| Page Type | Description |
|---|---|
product | A specific product offering |
solution | A group of offerings, high-level capability, or industry |
article | A details page for articles (for example, White Papers or Technical Specs) |
event | A details page for events (for example, Webinars or Conferences) |
learning | A details page for learning content (for example, Classes, Playbooks, Forums, or Documentation) |
If you encounter errors, define sfWebInteractionsDataLayer before initializing Google Tag Manager. For example:
For standard Google Tag implementations, define sfWebInteractionsDataLayer before initializing the Google Tag. For example: