Overview

Google Tag Manager allows convenient management of tracking and marketing optimization tags on a website. You can add a Tag ID as a System Configuration. This is covered in this article. You can also add them to Products. 

Getting Started

If you have not done so already, create a Google Tag.

Adding Your Google Tag to your Website

Log into your administrative console and navigate to Settings --> Setup --> Analytics. Select the Add New Analytics button.


Enter a Title, choose Google Tag Manager as the type, enter the ID, and click the Save button.

Your Google Tag will now be listed.

Selecting the Edit Icon allows you update it, inactivate it, or delete it.

Using your Google Tag as a System Configuration

Navigate to Settings --> Setup --> Configuration. Search for "Google Tag", select your Google Tag Manager analytic entry, and click the Save button. Once the ID has been saved, the system adds Google Tag Manager formatted data to the Confirmation Page with Order Details (com=confirmpurchase) for tracking.

Setup Pages

Using Google Tag Manager is the best way to track Conversions of specific Products.

/ is a system generated Shopping Cart page, not a content page, nor other sort of messaging.
/search is a Search of Products. Extensions to the URL such as &cid=xxx means searching for Products for that Category only.
/pd/ is a Product Detail page. The user has clicked a specific Product to view. The iid=xxxxxx identifies the Product ID being viewed.
/newaccount is the Create New Account page. This appears when a New Customer is creating an Account.
/paymentinfo is the page where customers enter Credit Card, Coupon Code and Payment information, nearing the completion of an Order.
/processpayment is the final page which displays an Order Summary, Contact information, etc.
/confirmpurchase is the Confirmation page after an order has been processed. This is the conversion, but many clients define it differently.

Order Data Sample:
<script>window.dataLayer = window.dataLayer || [] dataLayer.push({"transactionId":"2584","transactionAffiliation":"Event_Product_A","transactionTotal":1485.67,"transactionTax":6.77,"transactionShipping":0.00,"transactionProducts":[{"customerPrice":2800.00,"sku":"1684","name":"Overnight_Trip","price":1350.00,"quantity":1},{"customerPrice":81.92,"sku":"497","name":"Rental_Item_2","price":20.00,"quantity":1},{"customerPrice":24.64,"sku":"119","name":"Merchandise_Item_33","price":19.95,"quantity":1}]});
</script>

Example

Here is a sample div for an order of 2 of the same product at the same price, with $10 paid by Account Credit and $10 by Credit Card:

<div id="OrderDetails">
  <h5>Order Summary</h5><table class='OrderSummary' cellspacing='0' ><tr class='ordernumrow'><td colspan='2' class='header' >Order Number: 6325</td><td></td><td></td><td></td></tr><tr class='orderdaterow'><td colspan='2' class='header' >Order Date: 12/18/2015 9:55 PM</td><td></td><td></td><td></td></tr><tr class='titlerow'><td class='qty' >Qty</td><td class='description' >Item</td><td class='itemprice' >Item Price</td><td class='balance' >Balance</td><td class='totals' >Total</td></tr><tr><td >1</td><td ><a href='http://testing.mycustomevent.com/ShoppingCart.aspx?com=detailview&iid=600' target='_blank'>Winter 2015 Event</a></td><td class='itempricecol' >$10.00</td><td class='itempricecol' ></td><td class='itempricecol' >$10.00</td></tr><tr><td ></td><td >Participant: Ted Garlock, </td><td ></td><td ></td><td ></td></tr><tr class='totalsrow'><td ></td><td class='totalsrow_desc' >Item Total</td><td class='totalsrow_border' >$10.00</td><td class='totalsrow_border' ></td><td class='totalsrow_border' >$10.00</td></tr><tr><td >1</td><td ><a href='http://testing.mycustomevent.com/ShoppingCart.aspx?com=detailview&iid=600' target='_blank'>Winter 2015 Event</a></td><td class='itempricecol' >$10.00</td><td class='itempricecol' ></td><td class='itempricecol' >$10.00</td></tr><tr><td ></td><td >Participant: T G30, </td><td ></td><td ></td><td ></td></tr><tr class='totalsrow'><td ></td><td class='totalsrow_desc' >Item Total</td><td class='totalsrow_border' >$10.00</td><td class='totalsrow_border' ></td><td class='totalsrow_border' >$10.00</td></tr><tr class='grandtotalrow'><td ></td><td class='totalsrow_desc' >Totals</td><td class='totalsrow_border' >$20.00</td><td class='totalsrow_border' >$0.00</td><td class='totalsrow_border' >$20.00</td></tr><tr class='subtotals'><td></td><td></td><td colspan='2' class='subtotal_label' >Subtotal</td><td >$20.00</td></tr><tr class='subtotals'><td colspan='4' class='subtotal_label' >Shipping</td><td >$0.00</td></tr><tr class='subtotals'><td colspan='4' class='subtotal_label' >Tax</td><td >$0.00</td></tr><tr class='subtotals'><td colspan='4' class='subtotal_label' style="text-align: right;">Account Credit</td><td style="text-align: right;border-top: 1px solid #000000;">($10.00)</td></tr><tr class='subtotals'><td colspan='4' class='subtotal_label' style="text-align: right;">CreditCard</td><td style="text-align: right;">($10.00)</td></tr><tr class='subtotals'><td colspan='4' class='subtotal_label' style="text-align: right;">Total Remaining Balance</td><td style="text-align: right;border-top: 1px solid #000000;">$0.00</td></tr></table>
  </div> 

For reference, this div looks like below in the UI: