Overview

Follow this guide to learn how to set up your Shopify Data Source.

Begin Shopify Source Setup

Welcome to Elevar:

• Begin on the Elevar homepage in your Elevar App and use the left-hand menu to locate and click on the "My Tracking" tab.
• Navigate to the section of the page titled "Welcome to Elevar!" and click on the "Set Up My Tracking" button.
  • (See Figure 1)

Figure 1

Set Up Data Sources:

• Navigate to the second step of setting up Elevar titled "Set Up Data Sources".
• Navigate to the Shopify box and click on the "Set Up" button located in the lower left-hand corner of the box.
  • (See Figure 2)

Figure 2

Shopify Setup Steps

Overview:

• You will be brought to a separate page. Navigate to the "Shopify Setup Steps" and ensure that you begin on the "Overview" tab.
• After reviewing the information, locate and click on the "Get Started" button at the bottom of the Overview section.
  • (See Figure 3)

Figure 3

Store Connection:

• After reviewing the Overview information, you will need to connect your Shopify Store.
  • Navigate to the "Store Connection" section of the page and click on the "Go to Shopify" button.
    • (See Figure 4)

Figure 4

Google Tag Manager and Data Layer

• After connecting your Shopify Store, you will need to review and confirm that your Google Tag Manager information is accurate.
  • Navigate to the section of the page titled "GTM Container ID" and ensure that your ID is accurate.
  • Navigate to the section of the page titled "Event Settings" and either click on the "Use best practices" or "Customize settings" button. By default, we select the most common data layer events.
  • You can expand the Event "Breakdown" button and review if you would like to make any adjustments.
• After reviewing and entering any required information for your Google Tag Manager account and Events settings, click on the "Save and Continue" button located at the bottom of this section.
  • (See Figure 5)

Figure 5

Consent Mode:

• After selecting the Google Tag Manager and Events settings, you will be prompted to enable Consent Mode.
  • To enable Consent Mode, click on the "Yes, enable for this destination" button and follow the set up documentation links for your consent provider found in the app.
  • If you do not want to enable Consent Mode, click on the "No" button.
• Once you have selected all of the information for enabling Consent Mode, click on the "Save and Continue" button at the bottom of this section.
  • (See Figure 6)

Figure 6

🚧

Legal requirements will vary by regions and if you have opt-in or opt-out requirements. Elevar does not offer legal advice regarding GDPR or any consent compliance. Please consult your legal team if unsure if you should make fallback selections

Prepare Your Store:

• After selecting details for Consent Mode, you need to prepare your store.
  • Remove any GTM script existing on your Shopify store. This may be found in your "theme.liquid", "Order Status Page Additional Scripts", "Additional Google Analytics Java Script", and any of your "Customer Events" scripts.
    • GTM is included with your Elevar scripts so you'll want to remove your other GTM script to avoid duplication.
    • If you are unsure if GTM is installed currently, review our article on how to check if GTM script is on your site.
• Once you have reviewed all of the required information and prepared your store, click on the "Save and Continue" button at the bottom of this section.
  • (See Figure 7)

Figure 7

Configure Custom Pixel:

• After preparing your store, you will need to configure the custom pixel.
  • Copy the code provided by clicking on the "Copy to Clipboard" button.
  • Create a custom pixel named "Elevar - Checkout Tracking" and paste the code.
  • Be sure to click on the save and connect button in the upper right-hand corner of the page.
• Once you have configured the custom pixel, click on the "Mark as Complete" button located at the bottom of this section.
  • (See Figure 8)

Figure 8

Final Step:

• After configuring the custom pixel, you will be brought to an overview page.
• Navigate to the section of the page titled "Final Step" and click on the "Go to Shopify" button.
  • This will take you to your live theme's "App embeds". Ensure that the Elevar App Embed is toggled "On". Then, click on the "Save" button located in the upper right-hand corner of the page.
• Once you have ensured that the Elevar App Embed is enabled, return to the "Final Step" section of the page.
  • (See Figure 9)

Figure 9

Detected on Live Theme:

• After completing all of the Shopify Setup Steps, you will be brought to an Overview page.
• If you see a "Detected on Live Theme" message located at the top of this overview page then you are all set!
  • (See Figure 10 )

Figure 10

Post Purchase Upsells

• If you have post-purchase upsells that occur between completing the payment and the thank you page follow our guide on how to track post-purchase upsells.

Code Repositories

• If you are using a code repository you may have additional updates to make. Reach out to your dev team for help if you are unsure how to make these updates.

Update your Code Repo to Ensure the App Theme Embed Stays Enabled

• You only need to complete this step if your settings_data.json file is included in your repo, and your code repo does not automatically pull updates from your live theme into your repo.
• Your settings_data.json file now contains this block to enable your Elevar Configurations via the App Theme Embed. It is important that this block is included in your settings_data.json file and the disabled value is set to false. If you include your settings_data.json file in your code repo, I would recommend updating the entire file to match your live theme.