Add analytics and tracking libraries to your FoxyCart store to discover how customers interact with your site.
The Google Tag integration allows you add tracking for Google Analytics 4 or Google Ads (or both) to your store.
loader.js
(as found on the “Sample Code” section of your store's administration) in your website template (do not include this in your cart, checkout, or receipt template). If you're not sure if you are, you can view your website source to confirm - you should see it included once in your own website's HTML, but not included if you view the source of the full-page cart, checkout or receipt.
The Google Tag integration supports Google Analytics 4 via the gtag G-123456789
tag ID or GTM GTM-123456
tag ID and Google Ads via the AW-123456789
tag ID. If you want to track both GA4 and Ads together, you can do this by adding your Google Ads profile as an additional destination for your GA4 Google Tag. You can see details on working with the Google Tag and merging tags here.
While Google Tag may also provide a GT-123456789
formatted tag ID, that is not fully supported at this time, and we recommend using one of the G-
, GTM-
or AW-
formats.
gtag.js
code. You should be either specifying a Tag ID of the format G-123456789
, GTM-12345
or AW-123456789
, depending if you're tracking Google Analytics (and optionally Ads) or just Google Ads. Note that you should not manually include the Google Tag code on the cart, checkout or receipt.G-123456789
tag ID or GTM GTM-123456
tag ID. If you are just wanting to track Google Ads, then your tag ID will look like AW-123456789
.conversion
event to be tracked on the receipt. You can get the “Send To” value from the installation steps for your Google Ads tag for your campaign. Look for the send_to
value within the integration code, which will have a format like AW-123456789/sABDCLqU3K2BEJb8cxDE
.Have you customised your cart, checkout or receipt templates? The tracking code is added through the custom footer placeholder within the templates. If you've customised them - double check that you've included the custom code placeholders as detailed on the template customisation wiki page
*.foxycart.com
) if you're not using a custom subdomain.The Google Analytics integration tracks the following events:
page_view
add_to_cart
*remove_from_cart
view_cart
begin_checkout
login
add_shipping_info
add_payment_info
purchase
The Google Ads integration tracks the following events:
conversion
If there are any other events that you want to track, these will need to be handled yourself manually.
For any events that include a value
, the total item price is used. For the purchase
event, shipping and taxes are also passed as separate attributes in the event payload.
Note that for the add_to_cart
event, the integration will try to pull out the cart details from the add to cart when it's processed by the Foxy javascript, including support for add to carts that add multiple products at once.
If you have a particularly custom set up or if you're not actually defining a normal add to cart form/URL, and our integration is not able to detect the product, the add_to_cart
event will not execute and you would instead need to trigger that manually yourself.
Note also that price option modifiers are currently not taken into account for the add_to_cart
event specifically.
As Foxy doesn't manage your website or product catalogue directly, it's hard for us to be able to track all of the ecommerce events that GA4 provides. One in particular, view_item
, is quite useful to track for customer journey reporting within GA4, but we don't track that as part of our integration. We would recommend adding that event as a custom event on your website on your product pages for a more complete ecommerce journey within your analytics.
You can see details on the ''view_item'' event on the GA4 documentation here.
As a reference, for the Foxy integration, we pass the following attributes for items
in GA4 ecommerce event calls:
item_name
item_category
price
quantity
item_id
(if the item has a code
attribute)
It is possible to override some of these values, or pass additional data to GA4 within the item data, by passing special reserved product options that are prefixed with _ga_
in your add to carts. You can see more information on the supported options here.
This is currently beta functionality. Specifying a GTM-
Google Tag ID will show a warning currently that it's not fully supported - but it is available for use as long as you have reviewed the notes below, especially around cookies and *.foxycart.com
subdomains.
If you enable our Google Tag integration with a GTM-
tag ID, note that the integration will include the GTM initialisation code on the cart, checkout and receipt for you. As such, you should not include the GTM initialisation code yourself on those pages, either directly in the template or in the configuration header/footer.
If you prefer to use Google Tag Manager, our integration pushes the events into the dataLayer
for you to then utilise in Custom Event tags.
All of the events listed above are supported, and for your tag within GTM, under “More Settings > Ecommerce”, you can simply check the “Send ecommerce data” with the data source set to “Data Layer”. As the data we push into the dataLayer
already includes all of the ecommerce data in the format that Google expects, it will automatically carry over for you.
If you prefer to have clean URL's in your analytics (like /cart
instead of /cart?fcsid=abc123
), then we do also pass a virtual_page_location
parameter with all of the events. You can add this as a User-Defined Variable in GTM, using the Data Layer v2 as the source. You can then pass an additional Event Parameter in your Custom Event tags for page_location
, with the value being the virtual_page_location
variable you created.
Specifically for GTM, there is also one additional custom event for virtual_page_view
. This is triggered when the Sidecart is opened, along with when the cart, checkout and receipt are loaded. It's up to you if you want to include this for your set up to track clean URL's for the page views for those aspects as well, instead of the default page view. The dataLayer for this event passes a virtual_page_location
parameter with the clean URL, along with a virtual_page_title
parameter to match to the page_title
for the page view event. Note that for events that occur on your website (for example, for add_to_cart
, remove_from_cart
or view cart
that happen via the Sidecart), the virtual_page_location
will be your website URL.
Example of individual tags configured within GTM for the ecommerce events:
One important note with the GTM integration is that it relies on Googles autoLinker to carry the users session across domains if you're making use of the *.foxycart.com
subdomain. If you're performing any custom redirects to the cart or checkout outside of standard Foxy functionality, then this might impact the ability for a customer session to be linked between your domain and the *.foxycart.com
store subdomain.
With this in mind, it's important that you set your *.foxycart.com
store subdomain as described within the Google Tag Configuration section.
Our gtag.js integration is able to account for this as we can maintain the users session as part of the cart session and use it when initialising the session on the cart/checkout/receipt. For GTM though, we aren't able to force a specific client/session ID to be used by GA from our side.
If you make use of a custom subdomain for your store which matches your website domain, then it's no longer cross-domain tracking, so it will be able to read the cookies fine.
If you enable the “Require consent before tracking customers” checkbox in the Google Tag configuration, then the following default values are set when the tracker is initialised on the full-page cart, checkout and receipt:
gtag('consent', 'default', { 'ad_storage': 'denied', 'ad_user_data': 'denied', 'ad_personalization': 'denied', 'analytics_storage': 'denied', 'wait_for_update': 500 });
It is then up to you to update some or all of those four denied
attributes to granted
when the user gives permission, like the following. If you use a custom subdomain for your store, you would be able to detect the consent state from your own domain, but if you use a *.foxycart.com
subdomain, you would need to seek consent for the cart/checkout/receipt specifically.
gtag('consent', 'update', { 'ad_storage': 'granted', 'ad_user_data': 'granted', 'ad_personalization': 'granted', 'analytics_storage': 'granted' });
The default
values Foxy sets also sets wait_for_update
to 500
(milliseconds), giving you a short window to set the granted
state before any tracking takes place.
Foxy does not display any consent prompt to customers automatically - it is up to you to use whatever consent manager you prefer, and to ensure that the granted
state is being set after consent is given.
If you are using GTM, the “Require consent before tracking customers” checkbox won't do anything, but instead you will need to configure consent within your tag manager.
First off, we strongly recommend creating a new profile in Google Analytics to test with. That way you don't have to worry about running 100 transactions and completely destroying the accuracy of the analytics, which is the entire point.
Within GA4, they have a feature called DebugView which is accessible from the “Property” section of the profile's “Admin”. To have your events appear within the DebugView, you either need to utilise the Google Analytics Debugger Chrome extension, or their Tag Assistant. You can see details on those here.
Once enabled, you can then monitor the DebugView timeline while interacting with your site, adding products to the cart and moving through checkout flow. You should see your normal interactions with the page like page views, scrolling and interactions, along with the events that the Foxy integration also tracks as listed above. The DebugView will also show you what details are passed with the events, including in most cases for the ecommerce based events, the items that were in the cart at that time.
Google Analytics via their Universal Analytics integration will stop tracking in July 2023. You can instead use the new Google Tag approach detailed above to add tracking with GA4 on your store.
loader.js
(as found on the 'Sample Code' section of your store's administration) in your website template (do not include this in your cart, checkout, or receipt template). If you're not sure if you are, you can view your website source to confirm - you should see it included once in your own website's HTML, but not included if you view the source of the full-page cart, checkout or receipt.SKU
parameter, which is the code
parameter in FoxyCart. If your products do not include a code
value (as passed in your add to carts) FoxyCart will attempt to generate one from the name
attribute, but FoxyCart will not take into account duplicate product names, which can clobber your data. If you are not using the code
parameter for your products, this Google Analytics tracking may not work correctly.https://your_foxycart_domain
with the https
(and not http
).analytics.js
and not gtag.js
, urchin.js
or ga.js
, which you can determine by the code that Analytics suggests you insert in your page. If you're still using an older Google Analytics type (like urchin.js
or ga.js
), we recommend upgrading to the new Universal type.gtag.js
within the Analytics administration, you can reference the analytics.js
tracking code you will need from this page.Using Google Tag Manager? Instead of using the Analytics tag that is provided by default with Google Tag Manager, create a “Custom HTML” tag, and paste into that the Tracking Code as detailed above. Also, if you include Google Tag Manager on your cart, checkout or receipt templates, ensure you don't include the Analytics tracking code on those pages - we include it for you automatically.
fcsid
to the “Exclude URL Query Parameters” in your analytics settings. Details here.mystore.foxycart.com
), click 'Add Referral Exclusion' and enter your store domain and click “Create”. (You can find this in the “store sub domain” value in your FoxyCart admin's “settings” page.) If you're using a custom subdomain like secure.yourstore.com
, you don't need to add it there.Name | URL |
---|---|
2Checkout | 2checkout.com |
Amazon FPS | amazon.com |
Bitpay | bitpay.com |
Curbstone | c3plp.net |
CyberSource Secure Acceptance | cybersource.com |
DIBS | payment.architrade.com |
Dwolla | dwolla.com |
iDEAL Ogone | secure.ogone.com |
PayPal | paypal.com |
Skrill | skrill.com |
Proceed to the next section
/receipt($|.*_cart|.*_checkout)
/receipt
Value
switch off. (It will be calculated dynamically.)/cart
for the Screen/Page. (You won't have this step if you are using “direct to checkout” with the parameter “cart=checkout”). Do not check the “required step” checkbox, as there are situations where the cart can be skipped./checkout
for the URL.If you're using a hosted payment method like PayPal Express Checkout or Amazon, you can create additional goals to track specific conversions for those options.
Name: “Sale (PayPal as Checkout)“
Destination: /receipt_paypal_ec_from_cart
Funnel:
/cart
/paypal_ec_checkout
/checkout
Name: “Sale (PayPal as Payment Method)”
Destination: /receipt_paypal_ec_from_checkout
Funnel:
/cart
/checkout
/paypal_ec_payment
Name: “Sale (Amazon as Payment Method)“
Destination: /receipt_amazon_mws_from_checkout
Funnel:
/cart
/checkout
/amazon_mws_payment
If you use other hosted gateways, you can set up goals for them as well, the goal would look like this:
Name: “Sale (NAME as Payment Method)“
Destination: /receipt_CODE_from_checkout
Funnel:
/cart
/checkout
/CODE_payment
In that gateway, you'd set NAME
to be the actual name of the gateway - this is for your reference within Google Analytics. You'd also change CODE
to match the code for your gateway:
Name | Code |
---|---|
2Checkout | twocheckout |
Amazon | amazon_mws |
Amazon FPS | amazon_fps |
Bitpay | bitpay |
Curbstone | curbstone |
CyberSource Secure Acceptance | cybersource_sa_web |
DIBS | dibs |
Dwolla | dwolla |
iDEAL Ogone | ogone |
PayPal (Reference Transactions) | paypal_ec |
PayPal (Legacy) | paypal |
Skrill | skrill |
Stripe Connect | stripe_connect_plastic_new and stripe_connect_plastic_saved |
Proceed to the next section.
Have you customised your cart, checkout or receipt templates? The tracking code is added through the custom footer placeholder within the templates. If you've customised them - double check that you've included the custom code placeholders as detailed on the template customisation wiki page
First off, we strongly recommend creating a new profile in Google Analytics to test with. That way you don't have to worry about running 100 transactions and completely destroying the accuracy of the analytics, which is the entire point.
For testing, Google Analytics has a great feature called “Real-Time” which is the first option under “Standard Reports” when looking at an individual analytics profiles reports. Using this section, you can pretty quickly track whether your analytics code is correctly set up. What you'll be doing is switching between Google Analytics Real-Time Overview page and your store as you perform different actions to ensure it's tracking you correctly. If it is, you should see an individual session being tracked as you move throughout the checkout flow - changing pages as you do.
Before starting, try clearing your browser's cookies (at least for the domains in question: your site domain and FoxyCart.com) and preferably using a browser that you don't use to develop in. So if you use Firefox to administer your site through a CMS and to login to the FoxyCart admin, try testing in Chrome or Safari. The goal is to pretend you're a normal customer.
_utm*
.Working with Analytics can be a big undertaking at times, and as changes to your set up isn't retroactively applied to previous statistics, can lead to some confusion in your data. We recommend setting up an analytics journal to keep track of any and all changes you make to your analytics profile and tracking code. By doing that, you can quickly compare your statistics to when you applied a certain change to make sure it's working, and possibly explain why the data is different to an earlier time period.
You can find more information on how to add a custom tracking code here: Using Custom Tracking Code