--- title: Baseline API Call Matrix slug: js-api/monetate-js-api-baseline-calls description: Description of what method calls must be included for all page types when implementing Monetate's JavaScript API image: https://archbee-image-uploads.s3.amazonaws.com/ceIfEvQHzQk1IVxoRWUh7/K9eTL4jKm7UQINb6zNziJ-20250912-181225.png docTags: createdAt: 2024-04-26T16:44:21.935Z --- The calls that you implement during a [baseline Monetate JavaScript API implementation](docId\:zcx_p3d6ND2Rr5bJLOyUG) are just the recommended API calls. You can implement more calls to customize your implementation to meet your business needs. ## Required for All Pages You must include the following for all page types when implementing the Monetate JavaScript API. ### monetateQ Each array in the `monetateQ` array contains instructions to add data that Monetate tracks. The first index of each array is the method name. The most common method is [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw), which is required in every `monetateQ` array to indicate the type of page that the customer is viewing. All data is sent asynchronously to Monetate by calling the [trackData](docId\:gcm0H169GurCQMv6sBota) method. This method takes no arguments. It can be called whenever data is ready to be sent to Monetate. :::hint{type="info"} Each time the `trackData` method is called, the `monetateQ` array is cleared so that new data can be pushed. ::: :::CodeblockTabs monetateQ Example ```javascript // monetateQ Example window.monetateQ.push([ method, data ]); ``` ::: Add the `monetateQ` array in the page template directly after the [Monetate tag](docId\:zcx_p3d6ND2Rr5bJLOyUG). ### trackData This [method](docId\:gcm0H169GurCQMv6sBota) sends the information from the `monetateQ` array to Monetate. Call `trackData` after all information has been stored in the array. You can call `trackData` again if any changes are made to the page after the page loads. Place it at the bottom of the page after all other content has been loaded and relevant information has been added to `monetateQ`. When you call `trackData` more than once because major elements or content on the site has changed (for example, on a single-page application), you must resend all the data to Monetate, including the page type. ### AJAX Retracking If new information or products appear on a page without a new page load, you must retrack, or send a new `trackData` request, so that the Monetate platform can re-evaluate the page. See [Page Retracks](docId\:z7zs1BulqPT_0Z1CoYHww) for more information. ## String Validation :::hint{type="warning"} All data that you pass to Monetate through the methods included in this API must be in the form of a string. Passing an integer instead of a string or omitting quotation marks around a string ("string") results in an error. ::: All strings passed to Monetate need to be in a valid format. These strings are listed below. The API references the following types: - `string` is a JavaScript `typeof` string that cannot be empty. - `idString` is a string without spaces. - `pidString` is an `idString` with no more than 50 characters. - `quantityString` is an `idString` composed only of numerals. The number must be greater than zero and less than one billion. - `priceString` is an `idString` made up of any number of numerals followed by an optional period and by one or two optional numerals. - `currencyString` is an `idString` that must adhere to the [ISO 4217](https://www.iso.org/iso-4217-currency-codes.html) format of three capital letters and no spaces. ### Variable Field Length Certain properties available for each method call have a maximum field length. Any field with a maximum length is listed in this table. | **Attribute** | **Data Type** | **Maximum** | **Example** | | ------------- | ------------- | ----------- | -------------- | | `purchase_id` | VARCHAR | 50 | "123456789" | | `sku` | VARCHAR | 50 | "123456789" | | `pid` | VARCHAR | 50 | "123456789" | | `quantity` | INT | 11 | "123456789101" | | `unit_price` | DECIMAL | 9,2 | "900999500.00" | | `currency` | VARCHAR | 3 | "$" | | `trackEvent` | VARCHAR | 32 | "50140" | :::hint{type="info"} Duplicate `purchase_id` entries are removed. Each entry's `purchase_id` must be unique. Furthermore, subsequent `purchase_id` entries don't need to be incremental. ::: ## Product IDs and SKUs in Method Calls Although both product IDs (PIDs) and SKUs are required in a product catalog, you're only required to implement method calls for PIDs. However, including SKUs enhances the capabilities of both [Product Recommendations](https://docs.monetate.com/docs/recommendations) and [product-badging actions](https://docs.monetate.com/docs/product-badging). When choosing a PID to send back to Monetate, use one that is available across all pages when a product is viewed. ## Baseline API Calls ::::ExpandableHeading ## Home Page Sometimes called the landing page, the home page is the main page on your site. It's usually the first page where site visitors see when they arrive. ### Method Calls [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) ### Recommended Page Type `main` ### Code Sample :::CodeblockTabs Main Page Example ```javascript // Main Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "main" ]); window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Index Page An index page lists multiple products in a grid or listing for customers to browse. The products on this type of page *are not* the result of a search performed by a visitor. :::hint{type="info"} Search pages and index pages use the code format contained in this documentation since they normally follow the same page template for your site. Ensure that you use a different page type for each so that if, for example, you want an action to target index pages but not search pages, you can easily do so with **Page Type=** [action conditions](https://docs.monetate.com/docs/action-conditions). ::: ### Method Calls - [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) - [addProducts](docId:3PjolBdlNPr_npNubE34U) ### Recommended Page Type `index` ### Code Example :::CodeblockTabs Index Page Example ```javascript // Index Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "index" ]); window.monetateQ.push([ "addProducts", [{ "productId": "pidString1", "sku": "optionalSkuString1" }, { "productId": "pidString2", "sku": "optionalSkuString2" }, { "productId": "pidString3", "sku": "optionalSkuString3" }, { "productId": "pidString4", "sku": "optionalSkuString4" }, { "productId": "pidString5", "sku": "optionalSkuString5" } ] window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Search Page A search page lists multiple products in a grid or listing that are the result of a search the site visitor performed. :::hint{type="info"} Search pages and index pages use the code format contained in this documentation since they normally follow the same page template for your site. Ensure that you use a different page type for each so that if, for example, you want an action to target index pages but not search pages, you can easily do so with **Page Type=** [action conditions](https://docs.monetate.com/docs/action-conditions). ::: ### Method Calls - [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) - [addProducts](docId:3PjolBdlNPr_npNubE34U) ### Recommended Page Type `search` ### Code Example :::CodeblockTabs Search Page Example ```javascript // Search Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "search" ]); window.monetateQ.push([ "addProducts", [ { "productId": "pidString1", "sku": "optionalSkuString1" }, { "productId": "pidString2", "sku": "optionalSkuString2" }, { "productId": "pidString3", "sku": "optionalSkuString3" }, { "productId": "pidString4", "sku": "optionalSkuString4" }, { "productId": "pidString5", "sku": "optionalSkuString5" }] ]) window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Product Detail Page A product detail page, sometimes called simply a product page, contains such key information as available sizes, colors, models, or other variations of a specific product. ### Method Calls - [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) - [addProductDetails](docId\:zlbUl8IBXhdEaLdjWTMus) ### Recommended Page Type `product` ### Code Example :::CodeblockTabs Product Detail Page Example ```javascript // Product Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "product" ]); window.monetateQ.push([ "addProductDetails", [{ productId: "pidString", sku: "optionalSkuString" }] ]); window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Cart Page The cart page is any page on your site on which the visitor sees what products are in their cart. :::hint{type="info"} If cart data is available on all pages, Monetate recommends including the `addCartRows` method to all pages and not just your "cart" page. ::: ### Method Calls - [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) - [addCartRows](docId\:Y-wcMRn_146QuOtE7NjFt) ### Recommended Page Type `cart` ### Code Example :::CodeblockTabs Cart Page Example ```javascript // Cart Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "cart" ]); window.monetateQ.push([ "addCartRows", [{ "productId": "a123", "sku": "c678", "quantity": "1", "unitPrice": "99.99", "currency": "USD" }, { "productId": "b345", "sku": "d987", "quantity": "3", "unitPrice": "29.99", "currency": "USD" }] ]); window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Checkout Page The checkout page shows registered users a summary of their order details. ### Method Calls [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) ### Recommended Page Type `checkout` :::CodeblockTabs Checkout Page Example ```javascript // Checkout Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "checkout" ]); window.monetateQ.push([ "trackData" ]); ``` ::: :::: ::::ExpandableHeading ## Purchase Confirmation Page The purchase confirmation page loads after a customer has completed a transaction. ### Method Calls - [setPageType](docId\:sMKHQB02vPvMs-RhqI3Iw) - [addPurchaseRows](docId\:FNV9UUKQMKGlIdpGCa_5Z) ### Recommended Page Type `purchase` ### Code Example :::CodeblockTabs Purchase Page Example ```javascript // Purchase Page Example window.monetateQ = window.monetateQ || []; window.monetateQ.push([ "setPageType", "purchase" ]); "window.monetateQ.push([ "addPurchaseRows", [{ "purchaseId": "73893797", "productId": "a123", "sku": "c678", "quantity": "1", "unitPrice": "99.99", "currency": "EUR" }, { "purchaseId": "73893797", "productId": "b345", "sku": "d987", "quantity": "3", "unitPrice": "29.99", "currency": "EUR" }] ]); window.monetateQ.push([ "trackData" ]); ``` ::: ::::