# Emitting Data App users and app developers can publish custom customer events from online store theme liquid files, [theme app extensions](/docs/apps/online-store/theme-app-extensions) and [checkout extensions](/docs/api/checkout-ui-extensions/latest/extension-points-overview). When custom customer events are published they can be accessed by all custom pixels and app pixels. ## Publishing custom events The `analytics.publish` method is available in different contexts for publishing custom events. The `analytics.publish` method takes an `event_name` and some `event_data` as parameters. The object passed into the `event_data` field is shared with subscribers to the event using the `customData` field. If you haven't set up a way for users to define custom transformation of payloads, then your app pixels might not be able to parse these custom fields. Custom pixels, though, can be changed by the users to translate custom fields to a service’s required format. ### Publishing Custom Events ```js /** * In the online store you can access the `analytics.publish` method on the Shopify object. * Inside theme app extensions or within the `<script>` tag of theme.liquid files, you can * insert the following code to publish your custom pixels. */ /** * event_name * type: string * description: The name of a single event or a group of events. */ const event_name = 'my_custom_event'; /** * event_data * type: Object * description: An object that contains metadata about the event. */ const event_data = {sample_event_data: 1}; /** * @param: event_name * @param: event_data * */ Shopify.analytics.publish(event_name, event_data); ``` ```javascript // In checkout, you can publish custom events from your checkout extensions. /** * event_name * type: string * description: The name of a single event or a group of events. */ const event_name = 'my_custom_event'; /** * event_data * type: Object * description: An object that contains metadata about the event. */ const event_data = {sample_event_data: 1}; /** * @param: event_name * @param: event_data */ analytics.publish('event_name', event_data); ``` ## Subscribing to custom events You can subscribe to custom events like you would standard events. Anything published to the custom event is passed to the `customData` field. ### Subscribing to Custom Events ```javascript // Subscribe from web pixel app extension import {register} from '@shopify/web-pixels-extension'; register(({analytics}) => { analytics.subscribe('my_custom_event', (event) => { /* event = { id: "123", clientId: "2cabc5d8-e728-4359-9173-4b31265cbac0", name: "my_custom_event", timestamp: "2011-10-05T14:48:00.000Z", context: { ... }, customData: { foo: { bar: '123' }, abc: { def: 'geh' } } } */ }); }); ``` ```javascript // Publish from Checkout Extension analytics.publish('my_custom_event', { foo: { bar: '123', }, abc: { def: 'geh', }, }); ``` ## Visitor API The 'analytics.visitor' method helps merchants to identify visitors to their store. The method is primarily intended for use cases involving visitor-provided information to aid Shopify, and app features that use the data to enhance the customer experience. For example, if a visitor submits their email address to receive a 30% off coupon, then the email can be relayed to a Partner app using Server Pixels to power loyalty features. The storefront experience can be personalized based on existing information that the merchant already has about the customer. It's important to ensure that, when utilizing this API, all necessary notices and consent in the visitor's region are provided. ### Visitor API ```js /** * In the online store, you can access the `analytics.visitor` method on the Shopify object. * Inside theme app extensions or within the `<script>` tag of liquid files, you can * insert the following code to publish your custom pixels. */ /** * @param {Object} visitorInfo - The parameters for the visitor information. * @param {string} [visitorInfo.phone] - The phone number. * @param {string} [visitorInfo.email] - The email address. * @param {Object} [options] - Additional settings and context for calls to visitor. * @param {string} [options.appId] - The App Id of the calling app. * @returns {boolean} - Returns `true` if the visitor method was successful, and returns `false` if the payload was rejected. This method will raise an error if there is an issue with the payload. */ // Usage: Shopify.analytics.visitor( { email: 'someEmail@example.com', phone: '+1 555 555 5555', }, { appId: '1234', }, ); ``` ```javascript // In checkout, you can emit visitor information from your checkout extensions using the analytics API within the StandardAPI. /** * @param {Object} visitorInfo - The parameters for the visitor information. * @param {string} [visitorInfo.phone] - The phone number. * @param {string} [visitorInfo.email] - The email address. * @returns {Promise<VisitorResult>} - Returns a VisitorResult object. See https://shopify.dev/docs/api/checkout-ui-extensions/unstable/apis/standardapi#properties-propertydetail-analytics */ // Usage: analytics .visitor({ email: 'someEmail@example.com', phone: '+1 555 555 5555', }) .then((result) => { if (result.type === 'success') { console.log(`Success`, JSON.stringify(result)); } else { console.log(`Error`, JSON.stringify(result)); } }); ``` ## References - [alert_displayed](https://shopify.dev/docs/api/web-pixels-api/standard-events/alert_displayed.txt): The `alert_displayed` event records instances when a user encounters an alert message, whether it's an inline validation message on an input field or a warning banner. This event is only available on checkout. - [cart_viewed](https://shopify.dev/docs/api/web-pixels-api/standard-events/cart_viewed.txt): The `cart_viewed` event logs an instance where a customer visited the cart page. - [checkout_address_info_submitted](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_address_info_submitted.txt): The `checkout_address_info_submitted` event logs an instance of a customer submitting their mailing address. This event is only available in checkouts where Checkout Extensibility for customizations is enabled - [checkout_completed](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed.txt): The `checkout_completed` event logs when a visitor completes a purchase. It's triggered once for each checkout, typically on the **Thank you** page. However, for upsells and post purchases, the `checkout_completed` event is triggered on the first upsell offer page instead. The event isn't triggered again on the **Thank you** page. If the page where the event is supposed to be triggered fails to load, then the `checkout_completed` event isn't triggered at all. - [checkout_contact_info_submitted](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_contact_info_submitted.txt): The `checkout_contact_info_submitted` event logs an instance where a customer submits a checkout form. This event is only available in checkouts where Checkout Extensibility for customizations is enabled - [checkout_shipping_info_submitted](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_shipping_info_submitted.txt): The `checkout_shipping_info_submitted` event logs an instance where the customer chooses a shipping rate. This event is only available in checkouts where Checkout Extensibility for customizations is enabled - [checkout_started](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_started.txt): The `checkout_started` event logs an instance of a customer starting the checkout process. This event is available on the checkout page. For Checkout Extensibility, this event is triggered every time a customer enters checkout. For non-checkout extensible shops, this event is only triggered the first time a customer enters checkout. - [collection_viewed](https://shopify.dev/docs/api/web-pixels-api/standard-events/collection_viewed.txt): The `collection_viewed` event logs an instance where a customer visited a product collection index page. This event is available on the online store page. - [page_viewed](https://shopify.dev/docs/api/web-pixels-api/standard-events/page_viewed.txt): The `page_viewed` event logs an instance where a customer visited a page. This event is available on the online store, checkout, and **Order status** pages. - [payment_info_submitted](https://shopify.dev/docs/api/web-pixels-api/standard-events/payment_info_submitted.txt): The `payment_info_submitted` event logs an instance of a customer submitting their payment information. This event is available on the checkout page. - [product_added_to_cart](https://shopify.dev/docs/api/web-pixels-api/standard-events/product_added_to_cart.txt): The `product_added_to_cart` event logs an instance where a customer adds a product to their cart. This event is available on the online store page. - [product_removed_from_cart](https://shopify.dev/docs/api/web-pixels-api/standard-events/product_removed_from_cart.txt): The `product_removed_from_cart` event logs an instance where a customer removes a product from their cart. This event is available on the online store page. - [product_viewed](https://shopify.dev/docs/api/web-pixels-api/standard-events/product_viewed.txt): The `product_viewed` event logs an instance where a customer visited a product details page. This event is available on the product page. - [search_submitted](https://shopify.dev/docs/api/web-pixels-api/standard-events/search_submitted.txt): The `search_submitted` event logs an instance where a customer performed a search on the storefront. The products returned from the search query are in this event object (the first product variant for each product is listed in the array). This event is available on the online store page. - [ui_extension_errored](https://shopify.dev/docs/api/web-pixels-api/standard-events/ui_extension_errored.txt): The `ui_extension_errored` event logs occurrences when an extension fails to render due to an uncaught exception in the extension code. This event is only available on checkout. - [analytics](https://shopify.dev/docs/api/web-pixels-api/standard-api/analytics.txt): Provides access to Shopify's [customer event API](/docs/api/web-pixels-api/standard-events) - [browser](https://shopify.dev/docs/api/web-pixels-api/standard-api/browser.txt): Provides access to specific browser methods that asynchronously execute in the top frame (`cookie`, `localStorage`, `sessionStorage`) - [customerPrivacy](https://shopify.dev/docs/api/web-pixels-api/standard-api/customerprivacy.txt): Provides access to the [customerPrivacy API](/api/web-pixels-api/pixel-privacy#customer-privacy-api) to track whether or not customers have given consent. - [init](https://shopify.dev/docs/api/web-pixels-api/standard-api/init.txt): A JSON object containing a snapshot of the page at time of page render. It will always have the present `Context` of the page, as well as the `Data` field, which provides access to the `Cart` and `Customer` objects. - [settings](https://shopify.dev/docs/api/web-pixels-api/standard-api/settings.txt): Provides access to the settings JSON object as set by the [GraphQL Admin API](https://shopify.dev/docs/apps/marketing/pixels/getting-started#step-5-create-a-web-pixel-setting-for-the-store) **(Web pixel app extensions only)**. The structure of this object is a string keyed hash map: `Record<string, any>`. - [clicked](https://shopify.dev/docs/api/web-pixels-api/dom-events/clicked.txt): The `clicked` event logs an instance where a customer clicks on a page element. - [form_submitted](https://shopify.dev/docs/api/web-pixels-api/dom-events/form_submitted.txt): The `form_submitted` event logs an instance where a form on a page is submitted. - [input_blurred](https://shopify.dev/docs/api/web-pixels-api/dom-events/input_blurred.txt): The `input_blurred` event logs an instance where an input on a page loses focus. - [input_changed](https://shopify.dev/docs/api/web-pixels-api/dom-events/input_changed.txt): The `input_changed` event logs an instance where an input value changes. - [input_focused](https://shopify.dev/docs/api/web-pixels-api/dom-events/input_focused.txt): The `input_focused` event logs an instance where an input on a page gains focus. - [advanced_dom_available](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_available.txt): Event published when the DOM has been loaded and is available for interaction. - [advanced_dom_changed](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_changed.txt): Event published when the DOM has been changed in any way, such as an element being added, removed, or modified. - [advanced_dom_clicked](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_clicked.txt): Event published when a customer clicks on a page element. - [advanced_dom_clipboard](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_clipboard.txt): Event published when a customer has cut, copied or pasted text to or from the clipboard. - [advanced_dom_form_submitted](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_form_submitted.txt): Event published when a form is submitted. - [advanced_dom_input_blurred](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_input_blurred.txt): Event published when an input loses focus. - [advanced_dom_input_changed](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_input_changed.txt): Event published when an input value changes. - [advanced_dom_input_focused](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_input_focused.txt): Event published when an input gains focus. - [advanced_dom_mouse_moved](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_mouse_moved.txt): Event published when a customer moves their cursor over the page. - [advanced_dom_scrolled](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_scrolled.txt): Event published when a customer scrolls on a page or a scrollable element. - [advanced_dom_selection_changed](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_selection_changed.txt): Event published when a customer uses text selection on a page. - [advanced_dom_window_resized](https://shopify.dev/docs/api/web-pixels-api/advanced-dom-events/advanced_dom_window_resized.txt): Event published when a customer resizes their browser window.