Table of Contents
Conversion Tracking Pixels/Scripts
Often you'll need to be able to send off a ping, possibly with some basic information, to third party services when a customer completes a transaction. Commonly this is for services like Google Adwords, Facebook Ads etc, so you can tell how effective an ad campaign has been.
Generally speaking these services will give you some code to apply - either some javascript, or an image tag (or both) - and you just need to paste it onto the page where the customer ends up after completing their purchase. Some of these also require that you add in some details about the order, such as the total order cost, the transaction ID etc.
The FoxyCart receipt is where these scripts will need to be loaded, and to prevent double-ups, you'll also want to ensure that it's only run on the first time the receipt is loaded.
Adding custom code
To do that, you will include the provided code into the custom footer configuration option. To access that, head to the “configuration” section of your store's 2.0 FoxyCart administration, and look for the “Add custom header and footer code to your templates” configuration option. Enable that, and you'll see the footer textarea below.
Tracking one time only
To ensure that your code only executes the first time the receipt is loaded, you'll wrap it in a simple Twig tag that looks like this:
{% if first_receipt_display %}
{% endif %}
Including only on specific pages
If you need to include code on specific pages, you can also check for the page context as part of the Twig template, either for cart, checkout or receipt, or combinations of them, like this:
{% if context == "checkout" %}
{% endif %}
{% if context == "cart" or context == "checkout" %}
{% endif %}
If you need to target the cart, and limit to either just the full page cart, or just the sidecart display, you can also check the cart_is_fullpage variable:
{% if context == "cart" and cart_is_fullpage %}
{# Only Full Page Cart #}
{% endif %}
{% if context == "cart" and not cart_is_fullpage %}
{# Only Sidecart #}
{% endif %}
Example tracking script
For example, let's say we've been provided the following tracking pixel from a company we use:
<img src="https://example.com/track_sale?amount=TOTAL_ORDER_AMOUNT&tracking=ORDER_ID&userID=12345" width="1" height="1" />
The third party provider says that two values are needed here, the total order amount and the order ID.
Reviewing the Template View Data document, we can see what values we have available to us. For these particular values, we need {{ total_order }} and {{ transaction_id }} respectively. Paired with the if conditional for only displaying it on the first receipt display, our final code added to the footer textarea will look like this:
{% if first_receipt_display %}
<img src="https://example.com/track_sale?amount={{ total_order }}&tracking={{ transaction_id }}&userID=12345" width="1" height="1" />
{% endif %}
Common value placeholders
The full list of placeholders available on the FoxyCart templates can be seen on the Template View Data page, but below are some of the more common values:
{{ transaction_id }}- the id of the transaction{{ item_count }}- the total quantity of items in the cart{{ total_item_price }}- the total price of all the products in the cart{{ total_order }}- the total cost of the order, including shipping, taxes etc{{ total_shipping }}- the total cost of shipping{{ locale_info.int_curr_symbol|trim }}- the currency of the transaction
If you need to access information about the items in the cart, as it is an array of items it needs to be looped over to access those details. Here's an example showing that loop to create a comma separated list of item codes:
{% set item_codes = [] %}
{% for item in items %}
{% set item_codes = item_codes|merge([item.code]) %}
{% endfor %}
{{ item_codes|join(",") }}