Headless Implementation Overview

Elevar Version 3.9+

Overview

Elevar utilizes a Data Layer and Shopify Notifications to capture events and send them to various channels. These Data Layer events are picked up by GTM (Google Tag Manager) and also Elevar via a listener script added to your site so that they can be sent server-side.

The challenge with headless sites is that all user interactions are custom and do not utilize a consistent method for the user journey to checkout. The data model for the catalog including products, collections, pages, etc is also custom depending on the plugin or method used for fetching data. In contrast, Shopify’s online store provides a consistent set of web APIs and catalog modeling via Liquid syntax.

Elevar handles much of the complexity for processing data layer events, but relies on the merchant’s development team to implement the user interactions which includes catalog data.

Below is a diagram that explains the onsite functionality that Elevar provides. The Data Layer is enriched by Elevar and includes a listener script that is responsible for sending events server side where they ultimately end up at a channel like Google Analytics, Facebook CAPI, etc.


This guide will take the developers through: