Google Tag Manager (GTM) : Follow our GTM Integration Guide to set up the tracking through Google Tag Manager, allowing for more flexible and manageable tag deployments.
This article will guide you through the steps of manually installing JOIN Stories on a generic e-commerce platform.
The minimal integration includes the following steps:
Add the JavaScript script code to the <head> section
Add the Conversions Tracking codes
Step 1 - Adding the JavaScript script code
Once you are logged into your JOIN Stories account, you can continue with the installation by clicking this link. [mettre le lien de la page installation]
[Insérer screenshot sur comment aller dans les settings].
In your settings, click on Installation
[Insérer screenshot zoom sur le. bouton copier coller sur le tool dans "Installation"].
Within the Installation section, you'll find the Global JavaScript code. Simply click the "Copy Code" button to copy the JavaScript code.
Add the copied code to the <head> tag in your store.
The script will auto-detect that it's well integrated once you publish your website.
It is updated every 5mn.
Step 2 - Setting up conversion tracking (e-commerce)
At JOIN Stories, we offer two essential conversion tracking codes to help you monitor and analyze your sales performance:
Checkout Tracking Code (Most important and easiest to Implement):
Purpose: Tracks each successful checkout submission, allowing you to validate whether the visit and sale were generated by JOIN Stories or through other channels.
Implementation: This is straightforward and can be easily integrated into your website with minimal development effort.
Add to Cart Tracking Code:
Purpose: Monitors when customers add products to their shopping carts, providing deeper insights into customer behavior and engagement before the checkout process.
Implementation: Requires slightly more development capacity compared to the checkout tracking. However, it can be seamlessly integrated using Google Tag Manager (GTM) for those who prefer a tag management solution.
[insérer le lien de la documentation GTM]
Checkout Tracking Code
Please refer to the first step to access the installation page in your workspace settings
[insérer ici un screenshot pour Copy Code sur le Checkout Tracking Code]
Click on the Copy Code button.
Place this conversion code on your store's order confirmation page (also known as the Order Thank You page).
Ensure the conversion tracking code is loaded at the completion of each purchase, on the order confirmation page of your store.
The script will auto-detect that it's well integrated once you publish your website.
It is updated every 5mn.
Important:
When you add the code above to your purchase thank you page, make sure to replace all of the mandatory fields in red to personalize your code.
A complete list of mandatory fields is in the table below and you need to replace portions of the code with the correct placeholders
transaction_id | (string, required) | Unique identifier for the transaction |
total_base_amount | (number, required) | Total amount before discounts |
total_final_amount | (number, required) | Total amount after discounts |
currency | (string, required) | Currency code |
products | (array of objects, required) | List of products in the transaction. |
|
|
|
product_id | (string, required) | Unique identifier for the product |
product_variant | (string, optional) | Unique identifier for the product variant |
product_price | (number, required) | Selling price of the product |
product_base_price | (number, required) | Base price before discounts |
product_final_price | (number, required) | Final price after discounts |
product_quantity | (number, required) | Quantity purchased |
currency | (string, required) | Currency code (e.g., 'USD', 'EUR') |
Add to Cart Tracking Code (advanced)
[insérer ici un screenshot pour Copy Code sur le Add to Cart Tracking Code]
Click on the Copy Code button.
Paste the code snippet into the appropriate section of your website’s HTML where the add to cart action is triggered.
Ensure the add to cart tracking code is loaded when the Add to cart Action is triggered on your website.
The script will auto-detect that it's well integrated once you publish your website.
It is updated every 5mn.
Important:
When you add the code above to your purchase thank you page, make sure to replace all of the mandatory fields in red to personalize your code.
A complete list of mandatory fields is in the table below and you need to replace portions of the code with the correct placeholders
product_id | (string, required) | Unique identifier of the product |
product_variant | (string, optional) | Variant of the product (e.g., color, size) |
product_price | (number, required) | Selling price of the product |
product_base_price | (number, required) | Base price before discounts |
product_final_price | (number, required) | Final price after discounts |
product_quantity | (number, required) | Quantity added to the car |
currency | (string, required) | Currency code (e.g., 'USD', 'EUR') |