This article will guide you through the steps of manually installing Tolstoy on a generic ecommerce platform.
The minimal integration includes the following steps:
1. Add the JavaScript script code to the <head> section
2. Add the Conversion Tracking code
Follow the steps below to manually integrate Tolstoy with your store.
Who should use this guide?
Use this guide if you’re a merchant using an eCommerce platform other than Shopify
Step 1 - Adding the JavaScript script code
Integrating your store frontend includes placing Tolstoy’s core scripts and widgets in your storefront. Javascript is required so the widgets function can be displayed on your site.
Once you are logged into your Tolstoy account, you can continue with the installation by clicking this link. You can also use the following instructions to complete your manual installation for Tolstoy.
First, click on your profile letter on the lower left corner of the screen. Then, click on Settings.
In your settings, click on Installation.
Within the Installation section, you'll find the Tolstoy JavaScript code. Simply click the "Copy Code" button to copy the JavaScript code.
Add the copied code to the <head> tag in your store.
Tip: Keep your Tolstoy Settings open (seen in the picture below) in a separate tab or window from your ecommerce store. You’ll need to complete the set up of conversion tracking, which has instructions after number 4 below.
5. Once you have successfully added the JavaScript code to the <head> section of your website, please click the 'Complete' button to finalize the setup. In the screenshot below, I’ve already clicked the ‘Complete’ button, so it now shows ‘Completed’ and is grayed out.
Step 2 - Setting up conversion tracking
Tolstoy helps you engage your customers to drive traffic to your store, and boost your sales with its interactive and shoppable platform. The conversion tracking code enables you to measure those gains.
Following each successful checkout submission, Tolstoy validates if the visit and sale were generated by Tolstoy or self-served.
Step 2 is essential for tracking the conversion analytics of Tolstoy. You can locate the conversion tracking code within your Tolstoy account. You can find the code by clicking here or continue by following the instructions below.
Important:
Before moving on to the next step, ensure that you have successfully completed the JavaScript installation by clicking the 'Complete' button.
6. After you’ve completed the steps above, click on Step 2 Conversion Code in your Installation screen.
7. Click on the Copy Code button.
8. Place this conversion code on your store's order confirmation page (also known as the Order Thank You page).
9. Ensure the conversion tracking code is loaded at the completion of each purchase, on the order confirmation page of your store.
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.
Some mandatory fields include the ORDER_ID, TOTAL_PRICE, USER_EMAIL, and ORDER_CURRENCY.
A complete list of mandatory fields is in the table below and you need to replace portions of the code with the correct placeholders
Below is a table listing the required fields and examples of what they should be replaced with:
Required fields
Field | Example | What is it? |
appURL | davidis-store.myshopify.com | The URL to get to your store |
currency | USD | The currency used in your store |
The buyer’s email | ||
price | 220.00 | Should be a number either INT or String |
productId | 7447774789844
| Add here the product id / SKU |
quantity | 1 | How many of the products that were purchased |
title | Sweatshirt | Product name |
totalPrice | 182.6 | Should be the price of the item after discount. The calc should be as follow: (Item Price* Quantity) - (total discount) |
variantId | 42318830764244
|
Primarily for the Shopify backend, kindly include the variant ID of the purchased product. In case there isn't one, please provide the product ID here. |
orderId | 123456789
| order id |
totalPrice | 182.6 | Total price of the total order after discount. |
There are also several optional fields in the conversion code. It is your choice if you want to include them in the code. The code will work with or without these fields.
Below is a table listing the optional fields and examples of what they should be replaced with:
Optional fields
Field | Example | What is it? |
discounts | 37.40
| Amount of discount ( should be a number) |
presentmentCurrency | AUD | The currency that was used for the purchase when he/she completed the order. |
Tip: Click the ▶ to see the code examples
An example of what your conversion tracking should look like if there are 2 items ordered
An example of what your conversion tracking should look like if there are 2 items ordered
{
"appKey": "d5ea35b8-2ead-471e-8fc5-4bca9eeb0af2",
"orderId": 123456789,
"totalPrice": "242.78",
"currency": "USD",
"items": [
{
"variantId": 42318830764244,
"price": "220.00",
"productId": 7447774789844,
"title": "Sweatshirt", <--- Item #1
"quantity": 1,
"discounts": [
{
"amount": "37.40",
}
],
"totalPrice": 182.6
},
{
"variantId": 42294876471508,
"price": "30.00",
"productId": 7503111553236,
"title": "Socks", <--- Item #2
"quantity": 1,
"discounts": [
{
"amount": "5.10",
}
],
"totalPrice": 24.9
}
],
"email": "user@gotolstoy.com",
"appUrl": "davidis-store.myshopify.com"
}
An example of what your conversion tracking should look like with only 1 item
An example of what your conversion tracking should look like with only 1 item
{
"appKey": "d5ea35b8-2ead-471e-8fc5-4bca9eeb0af2",
"orderId": 123456789,
"totalPrice": "242.78",
"currency": "USD",
"items": [
{
"variantId": 42318830764244,
"price": "220.00",
"productId": 7447774789844,
"title": "Sweatshirt",
"quantity": 1,
"discounts": [
{
"amount": "37.40",
}
],
"totalPrice": 182.6
}
],
"email": "user@gotolstoy.com",
"appUrl": "davidis-store.myshopify.com"
}
Need help?
You can reach out to our friendly support team in two ways:
Via email at support@gotolstoy.com.
Using our live chat option, which can be found by clicking on the pink chat icon on any Tolstoy page in the lower right corner.