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.
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. |
The trackCartViewed function sends a Cart Viewed event to Segment.
Arguments:
None.
Returns:
undefined
Example:
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:
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:
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:
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:
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:
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:
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:
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:
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: