These events contain callbacks that get called on each page change inside the product browser.
The difference between OnPageLoad and OnPageLoaded is that the former is called when the page is changed (e.g. a link is clicked), while the latter is called later when the corresponding page is loaded inside the product browser.
The callback functions accept one parameter of type Page specifying which page is to be loaded (or has already been loaded). See Page Object details for more info.
If user visits cart page, do something:
Ecwid.OnPageLoaded.add(function(page) {
if (page.type == "CART") {
// do something ...
}
});
If you need more information about a product or category, use REST API. Public access token can be used in the client-side code, and private token on the server-side.
Page object
Describes the page displaying inside the product browser.
Get page type after new page is loaded:
Ecwid.OnPageLoaded.add(function(page){
console.log("Current page is of type: " + page.type);
});
// prints
// Current page is of type: CATEGORY
Fields:
| Name | Type | Description |
|---|---|---|
| name | string | For types: CATEGORY, PRODUCT. Name of the opened category or product |
| nameTranslated | object <Translations> | Translated name of the opened category or product according to current browser language |
| type | string, one of the following: ACCOUNT_SETTINGS, ADDRESS_BOOK, ORDERS, RESET_PASSWORD, CATEGORY, CART, CHECKOUT_ADDRESS_BOOK, CHECKOUT_PAYMENT_DETAILS, CHECKOUT_PLACE_ORDER, CHECKOUT_ADDRESS, CHECKOUT_DELIVERY, ORDER_CONFIRMATION, ORDER_FAILURE, CHECKOUT_RESULT, DOWNLOAD_ERROR, PRODUCT, SEARCH, FAVORITES, RESET_PASSWORD, SIGN_IN, ACCOUNT_SUBSCRIPTION | The type of the page. Some pages may have parameters, like: productId of the viewing product. Those parameters are described below. |
| keywords | string, optional | for type==’ORDERS’: the keywords that are used to find orders in the customer account page. for type==’SEARCH’: the keywords that are used to find products on the product search page. |
| from | integer timestamp, optional | for type==’ORDERS’: The timestamp of the start of the orders date range. |
| to | integer timestamp, optional | for type==’ORDERS’: The timestamp of the end of the orders date range. |
| offset | for type==’ORDERS’: the position of the current order list page (starting from 0). for type==’CATEGORY’ and SEARCH’: the position of the current product list page (starting from 0). | |
| categoryId | integer | for type==’CATEGORY’: the id of the showing product category or 0 if this is the starting page of the catalog and no categories are selected yet. for type==’PRODUCT’: the category internal id the current product has been navigated from. Zero (0) is the root category, −1 meaning that the category is unknown (e.g. a product opened from a search result). |
| mainCategoryId | integer | for type==’PRODUCT’ in the OnPageLoaded event: the internal id of category that is considered the default category of this product (in case if the product is assigned to a few different categories). If a product is assigned to a single category, mainCategoryId will be equeal to categoryId; if a product is not assigned to any category, its mainCategoryId is 0 (zero). for type==’PRODUCT’ in the OnPageLoad event: always 0 (zero); |
| sort | string, one of: ‘normal’, ‘addedTimeDesc’, ‘priceAsc’, ‘priceDesc’, ‘nameAsc’, ‘nameDesc’ | for type==’CATEGORY’ and ’SEARCH’: the order of the product list, as selected by the user in the ‘sort by’ drop-down. ‘Desc’ suffix stands for the descending order, ‘Asc’ suffix stands for the ascending order. |
| orderId | integer | for type==’CHECKOUT_RESULT’ and type==’ORDER_CONFIRMATION’: the internal id of the order (not to be confused with the store order number) |
| ticket | integer | for type==’CHECKOUT_RESULT’: the security random code that allows to retrieve information about the order |
| errorType | one of the following: ‘expired’, ‘invalid’, ‘limit’ | for type==’DOWNLOAD_ERROR’: the type of the error while downloading an e-good file. |
| key | integer, optional | for type==’DOWNLOAD_ERROR’: the downloading file internal id |
| productId | integer | for type==’PRODUCT’: the internal id of the displaying product (not to be confused with SKU). |
| orderNumber | integer | for type==’ORDER_CONFIRMATION’ the number of the order placed by customer(without prefix and suffix). |
| vendorOrderNumber | string | for type==’CHECKOUT_RESULT’ and type==’ORDER_CONFIRMATION’ the number of the order placed by customer(with prefix and suffix) |
| hasPrevious | boolean | true if customer visited some previous pages earlier and current page is not the entry page. false if current page is the first page of entry |
| variationId | number | Variation ID if specified in the URL. Learn more |
| filterParams | <FilterParameters> | Filter parameters used in product search request. For "CATEGORY" and "SEARCH" pages only |
| priceFrom | number | for type==’SEARCH’: lower bound of the price range filter |
| priceTo | number | for type==’SEARCH’: upper bound of the price range filter |
FilterParameters
| Name | Type | Description |
|---|---|---|
| attributes | <SelectedAttributes> | Information about selected attributes and their values |
| categories | Array of string | List of category IDs where customer searches in |
| includeProductsFromSubcategories | boolean | true if the search needs to include products from subcategories. false otherwise |
| keyword | string | The keyword customer used when searching for products |
| options | <SelectedOptions> | Information about selected options and their values |
| includeProductsFromSubcategories | boolean | True if the result's products are in a subcategory |
| inventory | string | Only "instock" value. Present if the "Availability" is set to "In stock" |
| priceFrom | number | The lower bound of the price range filter |
| priceTo | number | The upper bound of the price range filter |
SelectedAttributes
| Name | Type | Description |
|---|---|---|
| ATTRIBUTE_NAME | string | Attribute name is the field name and array of attribute value(s) is the value of this field |
SelectedOptions
| Name | Type | Description |
|---|---|---|
| OPTION_NAME | string | Option name is the field name and array of option value(s) is the value of this field |
Translations
| Field | Type | Description |
|---|---|---|
| <ISO_LANG_CODE> | string | Translations for each available language. Empty if no translations are provided. See available languages in store language settings |