Shopify Integration for GoSquared
Last updated: 12th March, 2021
📚 This guide shows you how to manually install GoSquared by adding some extra code snippets to your Shopify theme template files.
This will enable you to use the following GoSquared features:
- Analytics (Now, Trends, Ecommerce dashboards)
- Inbox
- Contacts – however the Shopify checkout process means we cannot track sales conversions.
Install GoSquared by updating your Shopify theme files
To start, you will need to create a GoSquared account and then follow the instructions below.
Log into your Shopify account and open your Shopify Admin dashboard
Go to Online Store > Themes.
Click the three ellipses icon and the click 'Edit HTML and CSS'. Here on the left side you will see all the folders and templates you'll need to edit.

To add GoSquared to All Pages
Go to Folder: Layouts > File: theme.liquid
You will now need your GoSquared Project Token. In a new tab log into your GoSquared account. You will find it in your Project Settings here www.gosquared.com/setup/general Copy your GoSquared Project Token.
Go back to your Shopify dashboard and paste the following script below the closing </head>
tag into your theme.liquid template file, replacing the GSN-XXXXXX-X
with your Project Token:
<script>
!function(g,s,q,r,d){r=g[r]=g[r]||function(){(r.q=r.q||[]).push(
arguments)};d=s.createElement(q);q=s.getElementsByTagName(q)[0];
d.src='//d1l6p2sc9645hc.cloudfront.net/gosquared.js';q.parentNode.
insertBefore(d,q)}(window,document,'script','_gs');
_gs('GSN-XXXXXX-X');
{% if customer.id %}
_gs("identify", {
email: "{{ customer.email }}",
first_name: "{{ customer.first_name }}",
last_name: "{{ customer.last_name }}",
phone: "{{ customer.default_address.phone }}",
custom: {
street: "{{ customer.default_address.street }}",
city: "{{ customer.default_address.city }}",
state: "{{ customer.default_address.province }}",
stateCode: "{{ billing_address.province_code }}",
postalCode: "{{ customer.default_address.zip }}",
country: "{{ customer.default_address.country }}",
countryCode: "{{ customer.default_address.country_code }}",
totalSpent: "{{ customer.total_spent }}",
allOrdersCount: "{{ customer.orders_count }}",
}
});
{% endif %}
</script>

To add GoSquared to Product Pages
Go to Folder: Templates > File: product.liquid
This will create Viewed Product and Added Product events.
Important Note: This is dependent on the theme you're using; if your theme uses Shopify AJAX cart you will need to look for another solution.
Include the below script as the last item in product.liquid
<script>
_gs("event", "Viewed Product", {
id: "{{ product.id }}",
name: "{{ product.title }}",
type: "{{ product.type }}",
url: "{{ product.url }}",
price: "{{ product.price | money_without_currency }}",
priceMin: "{{ product.price_min | money_without_currency }}",
priceMax: "{{ product.price_max | money_without_currency }}",
priceVaries: "{{ product.price_varies | money_without_currency }}",
variantsCount: "{{ product.variants.size }}",
firstAvailVariant: "{{ product.first_available_variant.title }}",
variantId: "{{ product.selected_variant.id }}",
variantAvailable: "{{ variant.available }}",
variantCompareAtPrice: "{{ variant.compare_at_price | money_without_currency }}",
variantQuantity: "{{ variant.inventory_quantity }}",
variantPrice: "{{ variant.price | money_without_currency }}",
variantSelected: "{{ variant.selected }}",
sku: "{{ variant.sku }}",
variantTitle: "{{ variant.title }}",
variantUrl: "{{ variant.url }}",
variantWeight: "{{ variant.weight }}",
vendor: "{{ product.vendor }}",
available: "{{ product.available }}",
optionsCount: "{{ product.options.size }}",
});
</script>
If you'd like to also track the products added to a users cart as an event, you’ll just also need to include the below script.
<script>
var cartButton = document.getElementById(“your-cart-button-id“);
function addProductEvent(){
_gs("event", "Added Product", {
id: "{{ product.id }}",
name: "{{ product.title }}",
price: "{{ product.price | money_without_currency }}",
quantity: "{{ product.quantity }}",
value: "{{ product.quantity }}*{{ product.price | money_without_currency }}"
});
};
cartButton.addEventListener("click", _gs(addProductEvent))
</script>

To add GoSquared to Category (Collection) Pages
Go to Folder: Templates > File: collection.liquid Shopify refers to your Product Category pages as Collections. Adding the below script will create a Viewed Product event that tracks your product category pages.
Add the script below as the last item in collection.liquid
<script>
_gs("event", "Viewed Product Category", {
category: "{{ collection.title }}",
categoryUrl: "{{ collection.url }}",
categoryProductCount: "{{ collection.all_products_count }}",
{% if collection.current_type %} filteredType: "{{ collection.current_type }}", {% endif %}
{% if collection.current_vendor %} filteredVendor: "{{ collection.current_vendor }}", {% endif %}
defaultSortBy: "{{ collection.default_sort_by }}",
referrerUrl: document.referrer,
referrerPath: new URL(document.referrer).pathname,
urlHref: window.location.href,
urlPath: window.location.pathname,
urlHash: window.location.hash
});
</script>

To add GoSquared to the Cart Page
Go to Folder: Templates > File: cart.liquid Adding the script below will track a Viewed Cart event.
Add the script below as the last item in cart.liquid
<script>
_gs("event", "Viewed Cart", {
itemCount: "{{ cart.item_count }}",
totalPrice: "{{ cart.total_price | money_without_currency }}",
totalWeight: "{{ cart.total_weight }}"
});
</script>

To add GoSquared to you Thank you Page
Due to the Shopify checkout flow, you will need to track a complete transaction differently.
Log into your Shopify account and go to Settings > Checkout Page
Scroll down to Order Processing and the "Additional content scripts" field.
You will now need your GoSquared Project Token. In a new tab log into your GoSquared account. You will find it in your Project Settings. Copy your GoSquared Project Token.
Include the following script in the "Additional content scripts" field replacing the GSN-XXXXXX-X
with your Project Token
<script>
!function(g,s,q,r,d){r=g[r]=g[r]||function(){(r.q=r.q||[]).push(
arguments)};d=s.createElement(q);q=s.getElementsByTagName(q)[0];
d.src='//d1l6p2sc9645hc.cloudfront.net/gosquared.js';q.parentNode.
insertBefore(d,q)}(window,document,'script','_gs');
_gs('GSN-XXXXXX-X');
{% if customer.id %}
_gs("identify", {
email: "{{ customer.email }}",
first_name: "{{ customer.first_name }}",
last_name: "{{ customer.last_name }}",
phone: "{{ customer.default_address.phone }}",
custom: {
street: "{{ customer.default_address.street }}",
city: "{{ customer.default_address.city }}",
state: "{{ customer.default_address.province }}",
stateCode: "{{ billing_address.province_code }}",
postalCode: "{{ customer.default_address.zip }}",
country: "{{ customer.default_address.country }}",
countryCode: "{{ customer.default_address.country_code }}",
totalSpent: "{{ customer.total_spent }}",
allOrdersCount: "{{ customer.orders_count }}",
}
});
{% endif %}
</script>
Then include the GoSquared transaction tracking script underneath it:
<script>
var transactionID = "{{ order_number }}";
_gs("transaction", transactionID, {
track:true
}, [
{% for line_item in line_items %}
{
name: "{{ line_item.title }}",
price: '{{line_item.price | money_without_currency }}',
quantity: "{{ line_item.quantity }}"
},
{% endfor %}
]
);
</script>

With all of the above set up, you'll have GoSquared Analytics, GoSquared Contacts and Inbox activated and ready to go on your site. If you would like to have GoSquared Live Chat on your store pages you need to Turn On Chat by going to your Project Settings > Inbox and toggling the slider "On" for `Enable Assistant`.