AnalyticsAPI
API
The API for interacting with web pixels.
Anchor to standardapiStandardApi
The base API object provided to this and other customer-account extension targets.
Anchor to analytics
analytics
required
Methods for interacting with Web Pixels, such as emitting an event.
Note
Requires to connect a third-party domain to Shopify for your customer account pages.
Was this section helpful?
Publish
import {
Banner,
reactExtension,
useApi,
} from '@shopify/ui-extensions-react/customer-account';
export const orderStatusBlockRender =
reactExtension(
'customer-account.order-status.block.render',
() => <Extension />,
);
function Extension() {
const {analytics} = useApi();
analytics
.publish(
'customer-account-extension-loaded',
{
extensionName: 'My Extension',
},
)
.then((result) => {
if (result) {
console.log(
'succesfully published event, web pixels can now recieve this event',
);
} else {
console.log('failed to publish event');
}
})
.catch((error) => {
console.log('failed to publish event');
console.log('error', error);
});
return <Banner>See console for result</Banner>;
}
Anchor to examplesExamples
Anchor to example-visitorVisitor
You can submit visitor information to Shopify, these will be sent to the shop backend and not be propagated to web pixels on the page.
Was this section helpful?
Visitor
import {
Banner,
reactExtension,
useApi,
} from '@shopify/ui-extensions-react/customer-account';
export const orderStatusBlockRender =
reactExtension(
'customer-account.order-status.block.render',
() => <Extension />,
);
function Extension() {
const {analytics} = useApi();
analytics
.visitor({
email: 'someEmail@example.com',
phone: '+1 555 555 5555',
})
.then((result) => {
if (result.type === 'success') {
console.log('Success', result);
} else {
console.error('Error', result);
}
});
return <Banner>See console for result</Banner>;
}