Spiffy allows easy integration with Google Tag Manager, enabling the use of Google Analytics and various third-party applications.
TIP: If you are embedding Spiffy Checkouts on your website, you will most likely want to add Google Tag Manager directly to your website, and not to Spiffy. This will prevent doubling up on loading code for your analytics and 3rd party apps like Chat/Help apps.
Setting Up Google Tag Manager
To begin, you will want to set up a ‘Workspace’ in your Google Tag Manager for your Spiffy URL. (eg: SpiffySupport.Spiffy.co) You can visit your Google Tag Manager ‘Account’ page at https://tagmanager.google.com/#/home to get started
If you don’t have an Account container set up yet, you will be able to add one here:
If you already have an Account container set up, Just click on the ‘Container Name’ to enter the workspace
Clicking on the ‘Container Name’ will take you into your ‘Workspace’, where you will set up your tags, and obtain your Google Tag Manager ID to integrate with Spiffy!
Copy your Google Tag Manager ID, You will need it for the next step of integrating with Spiffy.
Now that you have obtained your GTM-ID
, you will now need to just enable Spiffy’s Google Tag Manager integration.
In Spiffy, click on Settings in the bottom left navigation and select Integrations.
From the list of Integrations, find and select Google Tag Manager and enter your GTM-ID. Click Enable to save.
Once this is done, Spiffy will automatically install your Google Tag Manager <Header>
and <Footer> code onto all of your checkout pages, upsell pages, and Spiffy Thank-you pages.
IMPORTANT INFO ON GTM TRIGGER SETTINGS FOR GOOGLE ANALYTICS:
If you are using our hosted checkout URL, the Spiffy Thank You page, and/or our Upsell, you will need to adjust some settings with your Google Tag Manager Triggers, in order for Google Analytics track conversions and analytics effectively.
Spiffy Checkouts is what’s called a Single Page App, meaning that the page does not refresh when your customer goes from the Checkout to the Upsell, or from the Checkout to the Thank You page. This is what allows Spiffy to load so fast. You will need to configure your Google Tag Manager Trigger settings to fire on a the browser History change, not on a Pageview.
This does not apply in these scenarios:
Spiffy Checkout and redirecting to a custom Thank You page
This does apply in these scenarios:
Using the hosted Spiffy Checkout and the hosted Spiffy Thank You Page
Using the hosted Spiffy Checkout with Spiffy one-click upsell and redirecting to a custom Thank You page
Using the hosted Spiffy Checkout with Spiffy one-click upsell and the Spiffy Thank You page
Note: If you are using custom thank-you pages on your Spiffy checkouts, you will want to integrate Google Tag Manager with the site that your Thank You page is hosted on, as Spiffy won’t have any control over those pages.
Spiffy URL Structure
You may need specific tags to fire on different pages of your checkout flow. Below are the URLs for those pages so you can setup your triggers accordingly.
Main Checkout URL:
https://yourcompany.spiffy.co/checkout/my-awesome-checkout
Upsell Pages:
https://yourcompany.Spiffy.co/checkout/my-awesome-checkout/my-upsell
Hosted Thank-You Page:
https://yourcompany.Spiffy.co/checkout/my-awesome-checkout/thanks