Documentation You are here: start » integration » googleanalytics_universal

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
integration:googleanalytics_universal [2014/03/18 13:44] – [Setting Up Google Analytics] adamintegration:googleanalytics_universal [2021/09/10 09:31] (current) – [Setting Up Your Site] adam
Line 17: Line 17:
 <WRAP center round important 80%> <WRAP center round important 80%>
 These instructions are new, and while we have done some testing on the set up - the following are new instructions. Where possible we recommend testing this set up on a test profile before setting to your live analytics account, to ensure it works perfectly for your store. Any questions or issues, please get in touch with us. These instructions are new, and while we have done some testing on the set up - the following are new instructions. Where possible we recommend testing this set up on a test profile before setting to your live analytics account, to ensure it works perfectly for your store. Any questions or issues, please get in touch with us.
 +</WRAP>
 +
 +<WRAP center round info 80%>
 +**Using FoxyCart 2.0?** Google Analytics is now a configuration option within your store's administration. Take a look at [[v:2.0:analytics|Store Analytics]] for more information.
 </WRAP> </WRAP>
  
Line 57: Line 61:
   - Under 'Tracking Info' click 'Referral Exclusion List'. By default, your own website's domain should be present here, but we will need to add your store domain.   - Under 'Tracking Info' click 'Referral Exclusion List'. By default, your own website's domain should be present here, but we will need to add your store domain.
   - Click 'Add Referral Exclusion' and enter your store domain, such as "mystore.foxycart.com", and click "Create".   - Click 'Add Referral Exclusion' and enter your store domain, such as "mystore.foxycart.com", and click "Create".
 +  - If your own website domain isn't present in that list - add it as well.
   - Proceed to the next section   - Proceed to the next section
  
Line 128: Line 133:
 Proceed to the next section. Proceed to the next section.
 ===== Setting Up Your Site ===== ===== Setting Up Your Site =====
-  - On your own site, add the following to each page (except your FoxyCart cart, checkout and receipt templates), right before the closing ''</head>'' tag - ensuring that it's included **after** the foxycart.js file you copied from the Sample Code section of your stores FoxyCart administration:<code javascript><script>+  - On your own site, add the following to each page (except your FoxyCart cart, checkout and receipt templates), right before the closing ''</head>'' tag - ensuring that it's included **after** the foxycart.js file you copied from the Sample Code section of your stores FoxyCart administration. <wrap hi>Also, make sure you update the ''UA-XXXX-Y'' with your correct Analytics account identifier</wrap>:<code javascript><script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
   (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),   (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
Line 139: Line 144:
 </script> </script>
 <script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
-  fcc.events.cart.preprocess.add(function(e, arr) { +    fcc.events.cart.preprocess.add(function (e, arr) { 
-    if (arr['cart'] == 'checkout' || arr['cart'] == 'updateinfo' || arr['output'] == 'json') { +        if (arr['cart'] == 'checkout' || arr['cart'] == 'updateinfo' || arr['output'] == 'json') { 
-      return true; +            return true; 
-    } +        } 
-    if (arr['cart'] == 'checkout_paypal_express') { +        if (arr['cart'] == 'checkout_paypal_express') { 
-      ga('send', 'pageview', '/paypal_checkout', { +            if (window.ga && ga.loaded) { 
-        'hitCallback': function() { +                ga('send', 'pageview', '/paypal_checkout', { 
-          jQuery.getJSON('https://' + document.domain + '/cart?' + fcc.session_get() + '&h:_fcpm=paypal|cart&output=json&callback=?', function(cart) { +                    'hitCallback': function () { 
-            fcc.events.cart.preprocess.resume(); +                        jQuery.getJSON('https://' + document.domain + '/cart?' + fcc.session_get() + '&h:_fcpm=paypal|cart&output=json&callback=?', function (cart) { 
-          });+                            fcc.events.cart.preprocess.resume(); 
 +                        }); 
 +                    } 
 +                }); 
 +                return "pause"; 
 +            } else { 
 +                return true; 
 +            } 
 +        } 
 +        return true; 
 +    }); 
 +    //CAUSING LOOPING ISSUES IN CHROME 
 +    fcc.events.cart.process.add_pre(function (e, arr) { 
 +        if (window.ga && ga.loaded) { 
 +            ga(function (tracker) { 
 +                jQuery.getJSON('https://' + storedomain + '/cart?' + fcc.session_get() + '&h:ga=' + escape(tracker.get('clientId')) + '&output=json&callback=?', function (data) { 
 +                    fcc.events.cart.process.resume(); 
 +                }); 
 +            }); 
 +            return "pause"; 
 +        } else { 
 +            return true;
         }         }
-      }); 
-      return "pause"; 
-    } 
-    return true; 
-  }); 
-  fcc.events.cart.process.add_pre(function(e, arr) { 
-    ga(function(tracker) { 
-      jQuery.getJSON('https://' + storedomain + '/cart?' + fcc.session_get() + '&h:ga=' + escape(tracker.get('clientId')) + '&output=json&callback=?', function(data){ 
-        fcc.events.cart.process.resume(); 
-      }); 
     });     });
-    return "pause"; 
-  }); 
 </script></code> </script></code>
 +
 +    * <wrap hi>The above script includes the Google Analytics tracking code.</wrap> This means you don't need to paste the code from Google Analytics onto your website - otherwise you'll be including it twice and you don't want that.
     * <wrap info>In case you're wondering...</wrap> The key is that we want to keep the FoxyCart session up to date with the GA session data. The code above basically pushes the Google Analytics session id into the FoxyCart session so the GA session can be maintained between your own site's domain and your site's FoxyCart domain.     * <wrap info>In case you're wondering...</wrap> The key is that we want to keep the FoxyCart session up to date with the GA session data. The code above basically pushes the Google Analytics session id into the FoxyCart session so the GA session can be maintained between your own site's domain and your site's FoxyCart domain.
   - Do not put this code in your cart, checkout, or receipt templates.   - Do not put this code in your cart, checkout, or receipt templates.
Line 169: Line 185:
  
 ===== Setting Up Your FoxyCart Templates, The Full Details ===== ===== Setting Up Your FoxyCart Templates, The Full Details =====
-Copy the following and paste it above the closing ''</head>'' tag in the respective templates. This can be directly in your [[https://admin.foxycart.com/|FoxyCart admin]] or (preferably) in a template on your server that you will load into FoxyCart via FoxyCart's template caching functionality+Copy the following and paste it above the closing ''</head>'' tag in the respective templates. This can be directly in your [[https://admin.foxycart.com/|FoxyCart admin]] or (preferably) in a template on your server that you will load into FoxyCart via FoxyCart's template caching functionality. <wrap hi>Again, make sure you update the ''UA-XXXX-Y'' with your correct Analytics account identifier.</wrap>
  
 === The Cart Template === === The Cart Template ===
Line 192: Line 208:
     }     }
     $('a.fc_cart_checkout_paypal').click(function(e){     $('a.fc_cart_checkout_paypal').click(function(e){
-      e.preventDefault(); +      if (window.ga && ga.loaded)  { 
-      var link_url = jQuery(this).attr("href"); +        e.preventDefault(); 
-      var gateway = (jQuery(this).hasClass("fc_cart_checkout_amazon")) ? "amazon_fps" : "paypal"; +        var link_url = jQuery(this).attr("href"); 
-      ga('send', 'pageview', '/' + gateway + '_checkout', { +        var gateway = (jQuery(this).hasClass("fc_cart_checkout_amazon")) ? "amazon_fps" : "paypal"; 
-        'hitCallback': function() { +        ga('send', 'pageview', '/' + gateway + '_checkout', { 
-          $form = jQuery('<form method="post" target="_top"></form>').attr("action", link_url).appendTo("body"); +          'hitCallback': function() { 
-          jQuery.getJSON('https://' + document.domain + '/cart?fcsid=' + jQuery("input[name='fcsid']").first().val() + '&h:_fcpm=' + gateway + '|cart&output=json&callback=?', function(cart) { +            $form = jQuery('<form method="post" target="_top"></form>').attr("action", link_url).appendTo("body"); 
-            $form.submit(); +            jQuery.getJSON('https://' + document.domain + '/cart?fcsid=' + jQuery("input[name='fcsid']").first().val() + '&h:_fcpm=' + gateway + '|cart&output=json&callback=?', function(cart) { 
-          }); +              $form.submit(); 
-        } +            }); 
-      });+          } 
 +        }); 
 +      }
     });     });
   });   });
Line 223: Line 241:
 </script> </script>
 <script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
 +  var originalValidateAndSubmit = FC.checkout.validateAndSubmit;
   function ga_tracker() {   function ga_tracker() {
 +    var wait = false;
     if (typeof(fc_json.custom_fields['ga']) != "undefined") {     if (typeof(fc_json.custom_fields['ga']) != "undefined") {
       var method, method_co, source = "";       var method, method_co, source = "";
-  
       if (typeof(fc_json.custom_fields['_fcpm']) != "undefined" && fc_json.custom_fields['_fcpm'] != "") {       if (typeof(fc_json.custom_fields['_fcpm']) != "undefined" && fc_json.custom_fields['_fcpm'] != "") {
         var fcpm = fc_json.custom_fields['_fcpm'].split("|");         var fcpm = fc_json.custom_fields['_fcpm'].split("|");
Line 232: Line 251:
         source = fcpm[1];         source = fcpm[1];
       }       }
-  
       if (jQuery("input[name='fc_payment_method']:first").attr("type") == "radio") {       if (jQuery("input[name='fc_payment_method']:first").attr("type") == "radio") {
         method_co = jQuery("input[name='fc_payment_method']:checked").val();         method_co = jQuery("input[name='fc_payment_method']:checked").val();
Line 238: Line 256:
         method_co = jQuery("input[name='fc_payment_method']").val();         method_co = jQuery("input[name='fc_payment_method']").val();
       }       }
-  
       if (method != method_co || source == "checkout") {       if (method != method_co || source == "checkout") {
         method = method_co;         method = method_co;
         source = "checkout";         source = "checkout";
-        jQuery.getJSON('https://' + document.domain + '/cart?' + FC.checkout.config.session + '&h:_fcpm=' + method + "|" + source + '&output=json&callback=?', function(cart) { }); +        wait = true; 
-        if (method != "plastic" && method != "purchase_order" && source == "checkout") { +        jQuery.getJSON('https://' + document.domain + '/cart?' + FC.checkout.config.session + '&h:_fcpm=' + method + "|" + source + '&output=json&callback=?', function(cart) { 
-          ga('send', 'pageview', '/' + method + '_payment'); +          fc_json = cart; 
-        } +          if (method != "plastic" && method != "purchase_order" && source == "checkout") { 
-      }     +            ga('send', 'pageview', '/' + method + '_payment'); 
 +          } 
 +          originalValidateAndSubmit(); 
 +        }); 
 +      } 
 +    } 
 + 
 +    if (!wait) { 
 +      originalValidateAndSubmit();
     }     }
   }   }
-  FC.checkout.overload('validateAndSubmit', 'ga_tracker', null);+  FC.checkout.override('validateAndSubmit', 'ga_tracker');
 </script></code> </script></code>
  
 === The Receipt Template === === The Receipt Template ===
  
-There are three lines of Twig code that you need to alter in the receipt template - depending on the specific locale that your store is set to. See below the following code block on how to adjust these. 
 <code javascript><script> <code javascript><script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
Line 277: Line 301:
   {% endif %}   {% endif %}
 </script> </script>
-<script> +{% if first_receipt_display %} 
-  {% if first_receipt_display %} +  ^^analytics_google_ga_universal^^ 
-    {# Update these three variables based on your store configuration #} +{% endif %}</code>
-    {% set c_symbol = "$" %} +
-    {% set c_thousands = "," %} +
-    {% set c_decimal = "." %} +
- +
-    {% set ga_order_total = order_total|replace({ (c_symbol):"", (c_thousands):"" }) %} +
-    {% set ga_shipping_total = receipt_shipping_cost|replace({ (c_symbol):"", (c_thousands):"" }) %} +
-    {% set ga_tax_total = receipt_tax|replace({ (c_symbol):"", (c_thousands):"" }) %} +
-    {% if c_decimal != "." %} +
-      {% set ga_order_total = ga_order_total|replace({ (c_decimal):"." }) %} +
-      {% set ga_shipping_total = ga_shipping_total|replace({ (c_decimal):"." }) %} +
-      {% set ga_tax_total = ga_tax_total|replace({ (c_decimal):"." }) %} +
-    {% endif %} +
-    ga('require', 'ecommerce', 'ecommerce.js'); +
-    ga('ecommerce:addTransaction', { +
-      'id': '{{ order_id }}', +
-      'affiliation': '{{ store_name|raw }}', +
-      'revenue': '{{ ga_order_total }}', +
-      'shipping': '{{ ga_shipping_total }}', +
-      'tax': '{{ ga_tax_total }}' +
-    }); +
-    {% for item in items %} +
-      {% set ga_price_each = item.price_each|replace({ (c_symbol):"", (c_thousands):"" }) %} +
-      {% if c_decimal != "." %} +
-        {% set ga_price_each = ga_price_each|replace({ (c_decimal):"." }) %} +
-      {% endif %} +
-      ga('ecommerce:addItem', { +
-        'id': '{{ order_id }}', +
-        'name': '{{ item.name }}', +
-        'sku': '{{ item.code }}', +
-        'category': '{{ item.category_code }}', +
-        'price': '{{ ga_price_each }}', +
-        'quantity': '{{ item.quantity }}' +
-      }); +
-    {% endfor %} +
-    ga('ecommerce:send'); +
-  {% endif %} +
-</script></code> +
- +
-The three lines you may need to alter for the receipt template are: +
-<code javascript>{% set c_symbol = "$" %} +
-{% set c_thousands = "," %} +
-{% set c_decimal = "." %}</code>  +
- +
-If your store uses Euro's, and uses a decimal point as the thousands operator and a comma as the decimal point, you would update those three lines to look like this: +
-<code javascript>{% set c_symbol = "€" %} +
-{% set c_thousands = "." %} +
-{% set c_decimal = "," %}</code> +
 ===== Testing ===== ===== Testing =====
-{{ http://img.skitch.com/20101022-ki8kesq7397r7ucs2yjstgr5e5.png?250}}+{{ https://skitch-img.s3.amazonaws.com/20101022-ki8kesq7397r7ucs2yjstgr5e5.png?250}}
 First off, <wrap tip>we strongly recommend creating a new profile in Google Analytics to test with.</wrap> 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. First off, <wrap tip>we strongly recommend creating a new profile in Google Analytics to test with.</wrap> 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.
  

Page Tools

Site Tools