useAnalytics
The useAnalytics hook returns a set of functions that send a tracking event to Segment.
The starter sends most Segment events about user actions automatically, when other hooks like useCart are used. However, some events need to be closely tied to the UI, like click tracking, and must be sent explicitly by React components. Functions for sending these events are available via the useAnalytics hook.
Example
Returns
The useAnalytics hook returns an object with these properties:
Property | Description |
trackCartViewed | A function that sends a Cart Viewed event to Segment. |
trackCollectionClicked | A function that sends a Collection Clicked event to Segment. |
trackEmailCaptured | A function that sends an Email Captured event to Segment. |
trackProductClicked | A function that sends a Product Clicked event to Segment. |
trackProductListFiltered | A function that sends a Product List Filtered event to Segment. |
trackProductListViewed | A function that sends a ProductListViewed event to Segment. |
trackProductViewed | A function that sends a Product Viewed event to Segment. |
trackPromotionClicked | A function that sends a Promotion Clicked event to Segment. |
trackPromotionViewed | A function that sends a Promotion Viewed event to Segment. |
trackStockRequestCreated | A function that sends a Stock Request Created event to Segment. |
Functions
trackCartViewed
The trackCartViewed function sends a Cart Viewed event to Segment.
Arguments:
None.
Returns:
undefined
Example:
trackCollectionClicked
The trackCollectionClicked function sends a Collection Clicked event to Segment.
Arguments:
trackCollectionClicked({ id, description, imageUrl, slug, title })
Argument | Type | Description |
options.id | String | ID of the collection. |
options.description? | String | (Optional) Description of the collection. |
options.imageUrl? | String | (Optional) URL of an image for the collection. |
options.slug? | String | (Optional) Slug of the collection. |
options.title? | String | (Optional) Title of the collection. |
Returns:
undefined
Example:
trackEmailCaptured
The trackEmailCaptured function sends an Email Captured event to Segment.
Arguments:
trackEmailCaptured({ email, placement })
Argument | Type | Description |
options.email | String | Email that was captured |
options.placement?.component? | String | (Optional) Page component/module that captured the email. |
options.placement?.page? | String | (Optional) Page that captured the email. |
Returns:
undefined
Example:
trackProductClicked
The trackProductClicked function sends a Product Clicked event to Segment.
Arguments:
trackProductClicked({ productHandle })
Argument | Type | Description |
options.productHandle | String | Shopify product handle of the product. |
Returns:
undefined
Example:
trackProductListFiltered
The trackProductListFiltered function sends a Product List Filtered event to Segment.
Arguments:
trackProductListFiltered({ filter, list, sort })
Argument | Type | Description |
options.filter.type | String | Selected filter type. |
options.filter.value | String | Selected filter value. |
options.list.category | String | Product list category. |
options.list.id | String | Product list ID. |
options.sort.type | String | Product list sort type. |
options.sort.value | String | Product list sort value. |
Returns:
undefined
Example:
trackProductListViewed
The trackProductListViewed function sends a Product List Viewed event to Segment.
Arguments:
trackProductListViewed({ list })
Argument | Type | Description |
options.list.category | String | Product list category. |
options.list.id | String | Product list ID. |
Returns:
undefined
Example:
trackProductViewed
The trackProductViewed function sends a Product Viewed event to Segment.
Arguments:
trackProductViewed({ productHandle })
Argument | Type | Description |
options.productHandle | String | Shopify product handle of the product. |
Returns:
undefined
Example:
trackPromotionClicked
The trackPromotionClicked function sends a Promotion Clicked event to Segment.
Arguments:
trackPromotionClicked({ creative, id, name, position })
Argument | Type | Description |
options?.creative? | String | (Optional) Creative attached to promotion. |
options?.id? | String | (Optional) ID of the promotion. |
options?.name? | String | (Optional) Name of the promotion. |
options?.position? | String | (Optional) Position of the promotion on the site. |
Returns:
undefined
Example:
trackPromotionViewed
The trackPromotionViewed function sends a Promotion Viewed event to Segment.
Arguments:
trackPromotionViewed({ creative, id, name, position })
Argument | Type | Description |
options?.creative? | String | (Optional) Creative attached to promotion. |
options?.id? | String | (Optional) ID of the promotion. |
options?.name? | String | (Optional) Name of the promotion. |
options?.position? | String | (Optional) Position of the promotion on the site. |
Returns:
undefined
Example:
trackStockRequestCreated
The trackStockRequestCreated function sends a Stock Request Created event to Segment.
Arguments:
trackStockRequestCreated({ email, productHandle })
Argument | Type | Description |
options.email | String | The email address to sent an email to when the product is back in stock. |
options.productHandle | String | The Shopify product handle. |
Returns:
undefined
Example: