The product view signal captures user activity on product pages, enabling your marketing team to understand which products and product categories receive most attention. This signal is crucial for segmentation and allows you to tie product interest to identified visitors.

What constitutes a product page varies by business:

Retail: Product detail page or quick view
Travel: Itinerary, room or booking option view
Banking: Specific account opening page
Insurance: Specific policy application page

Availability: Premium and Ultimate

Implementation considerations

Relationship to product configuration signal

The product view signal works in conjunction with the product configuration signal:

Product view - Collects data about the product itself
Product configuration - Tracks user interactions on the product page (selecting size, checking reviews, etc.)

Triggering approach

Fire the product view signal each time a product details page or product details modal is loaded. On sites without individual product pages where multiple products are displayed together (such as a hotel room shortlist), send one product view signal for each product shown to the user.

Data layer

If your website has a data layer, it will speed up configuration and make the payload data more reliable. You can scrape product-related values from the DOM or from the data layer.

Product catalog integration

Your company's product catalog in Connect is dynamically updated based on incoming product view signals from your website.

If a signal contains a new product ID or category ID, Connect creates a new catalog entry based on the signal content.
If a product ID is already present in the catalog, Connect makes sure the default product attributes in the catalog are up-to-date with the signal (availability, brand description, brand name, currency, date added, discount, inventory quantity, model, MSRP, product category, product description, product name, product rating, product URLs, SKU and unit price).
If a category ID is already present in the catalog, Connect makes sure its name matches the signal content.

Special handling:

Null values in the signal do not overwrite existing catalog data.
Blank values (“”) update the catalog to blank/null.
Zero values update the related catalog field to zero.

Configuration

Method

TLT.logSignal(signalObject)

Sends the signal to the Acoustic Connect endpoint as a JSON object. The Connect library must be initialized before calling this method.

Signal structure

Top-level fields

category: String - Valid value - Behavior.
description: String - Description of the signal
effect: String - Describes the effect of the signal on engagement. Valid values: negative, positive. Use positive for all product views.
name: String - Name to differentiate this signal from others (for example, "Product view from website"). Max length - 256 chars.
signalType (required): String - Valid value - productView.

Signal content

availability: String - Indicates if the product is available for purchase (for example, "In Stock", "Out of Stock", "Back Order").
brandDescription: String - Description of the brand
brandName: String - Brand name of the product
categories: String - Product categories
currency: String - ISO 4217 currency code (for example, "USD", "EUR", "GBP"). If there is only one currency on your website, provide a static value. If there is a selection, use dynamic values.
dateAdded: Date - The date when the product was added to the product catalog. Format: yyyy-MM-dd HH:mm:ss.SSS.
discount: Number - Discount amount or difference between original and current price
imageUrls: Array of strings - URLs of product images
inventoryQuantity: Number - The number of units available
model: String - Model number or description
msrp: Number - Suggested retail price or original price. Must be a decimal or float.
productCategory: String - Product category from catalog
productCategoryId: String - Product category identifier
productDescription: String - Description of the product
productId (required): String - Unique product identifier (may match SKU)
productName (required): String - Name of the product
productRating: Number - Rating of the product
productStatus: String - Current lifecycle state (for example, "Active", "Discontinued", "Upcoming")
productUrls: Array of strings - URLs of product pages
promotionId: String - ID from marketing campaigns (hero images, CTAs) that led to this view
shoppingCartUrl: String - URL of the shopping cart
signalCustomAttributes: Array of objects - Additional custom attributes (each object needs name and value string fields)
sku: String - SKU (if different from product ID)
tags: Array of strings - Tags assigned to the product
unitPrice: Number - Unit price of the product
virtualCategory: String - Category based on navigation path (for example, "New arrivals", "Sale")

Notes:

If any required field is missing or invalid, the entire signal will be discarded.
Optional fields enhance the signal but won't prevent processing if omitted or invalid.

Basic example

const signal = {
    // Required fields
    signalType: "productView",
    category: "Behavior",
    name: "productView from website",
    productId: "SKU-12345",
    productName: "Wireless Headphones",
    unitPrice: 299.99,
    currency: "USD",
    effect: "positive",

    // Optional fields
    productDescription: "Premium noise-cancelling headphones",
    productCategory: "Electronics",
    discount: 30.00,
    availability: "In Stock",
    inventoryQuantity: 42,
    productUrls: ["https://example.com/products/headphones"],
    imageUrls: ["https://example.com/images/headphones.jpg"],
    shoppingCartUrl: "https://example.com/cart"
};

// Send the signal
TLT.logSignal(signal);

Complete implementation example 1 - Product details page

This example captures product view data from a standard product detail page:

// Check that the Connect SDK is present
if (window.TLT && window.TLT.isInitialized()) {
    const signal = {
        signalType: "productView",
        category: "Behavior",
        name: "productView generated by website",
        productId: "",
        productName: "",
        unitPrice: 0,
        currency: "USD",
        effect: "positive",
        productDescription: "",
        discount: 0,
        productCategory: "",
        productUrls: [],
        imageUrls: [],
        shoppingCartUrl: "https://www.sample.com/cart",
        virtualCategory: "",
        availability: "",
        brandName: "",
        brandDescription: "",
        model: "",
        msrp: 0,
        sku: "",
        productStatus: "",
        productRating: 0,
        dateAdded: "",
        promotionId: ""
    };

    // Check if we are on a product details page
    if (document.querySelector(".product_description")) {
        signal.productDescription = document.querySelector(".product_description")?.innerText || "";
        signal.productCategory = document.getElementById("productCategory")?.innerText || "";

        const article = document.querySelector(".product-tile");
        if (article) {
            signal.productId = article.getAttribute("data-sku") || "";
            signal.sku = signal.productId;
            signal.productName = article.getAttribute("data-name") || "";

            const productUrl = article.getAttribute("data-url");
            if (productUrl) {
                signal.productUrls.push(productUrl);
            }

            const imageUrl = article.getAttribute("data-image-url");
            if (imageUrl) {
                signal.imageUrls.push(imageUrl);
            }

            const discountedPrice = Number(article.querySelector(".price-sale")?.innerText || 0);
            const regularPrice = Number(article.querySelector(".price-default")?.innerText || 0);

            if (discountedPrice) {
                signal.unitPrice = discountedPrice;
                signal.discount = Math.round((regularPrice - discountedPrice) * 100) / 100;
            } else {
                signal.unitPrice = regularPrice;
            }

            // Optional: Log signal for debugging
            console.log("productView signal:", JSON.stringify(signal, undefined, 2));

            // Send signal to Acoustic
            window.TLT.logSignal(signal);
        }
    }
}

Complete implementation example 2 - Multiple products (hotel rooms)

This example sends separate signals for each product in a list:

// Check that the Connect SDK is present
if (window.TLT && window.TLT.isInitialized()) {
    const href = window.location.href;

    const signal = {
        signalType: "productView",
        category: "Behavior",
        name: "productView generated by website",
        productId: "",
        productName: "",
        unitPrice: 0,
        currency: "USD",
        effect: "positive",
        productDescription: "",
        productCategory: "",
        shoppingCartUrl: "https://www.sample.com/reservations",
        productUrls: [],
        imageUrls: []
    };

    // If a shortlist of hotel rooms is displayed
    if (href.includes("/reserve-a-room/") && document.querySelector("a.choose-room")) {
        const cards = document.querySelectorAll("div.card");

        // Send a signal for each room in the list
        cards.forEach((card) => {
            signal.productDescription = card.querySelector("#desc")?.innerText || "";
            signal.productName = card.getAttribute("room-id") || "";
            signal.productId = signal.productName;

            if (signal.productDescription.includes("your own kitchen")) {
                signal.productCategory = "Self catering";
            } else {
                signal.productCategory = "Standard room";
            }

            signal.unitPrice = Number(card.querySelector(".total-price")?.innerText || 0);

            // Optional: Log signal for debugging
            console.log("productView signal:", JSON.stringify(signal, undefined, 2));

            // Send signal to Acoustic
            window.TLT.logSignal(signal);
        });
    }
}

Best practices

Capture all product displays - Fire signals for product detail pages, quick views, and any other context where products are viewed.
Include category information - productCategory is crucial for segmentation and analytics.
Handle multiple products carefully - When showing multiple products (like hotel rooms), send one signal per product.
Use consistent identifiers - Ensure productId matches what you use in other product signals (add-to-cart, order, product configuration).
Use optional fields - Fields like availability, productRating, and inventoryQuantity help keep the product catalog up-to-date..

Troubleshooting

Signal not firing on product pages?

Verify the Connect library is initialized before firing signals.
Check that required fields are all populated.
Confirm your page detection logic correctly identifies product pages.
Use console.log() to verify the signal object before sending.

Missing product data?

Check if elements exist in DOM when the script runs.
Verify selectors match your site's HTML structure.
Consider using data layer if available for more reliable data.

Signals firing on non-product pages?

Review your page detection logic (URL patterns, DOM element checks).
Ensure conditional checks are specific enough.
Test on various page types to verify correct triggering.

Multiple signals for single product?

Check if script is running multiple times on page load.
Verify you're not attaching multiple event listeners.
Consider debouncing or adding flags to prevent duplicates.