First Steps
It's essential meet the requirements and follow the first steps strictly, to ensure that the tracking works as expected and sends data to the chosen platform/s.
Requirements
Before install the module, be sure you meet the minimum requirements
- PHP 7.1
- PrestaShop 1.6.1
- Consent Manager Provider (CMP)*
Tip
*The Consent Manager Provider (CMP) is a module that allows you to manage the consent of your customers to the use of cookies on your website. It is essential to comply with the GDPR and ePrivacy regulations. Be sure that your CMP solution is compliant with the GA4 web consent API or it has a professional solution for GTM.
Uninstall Other Tracking Modules
Warning
It’s essential to uninstall any other Google tracking module, or theme snippet code that deploys Google tracking, otherwise the dataLayer will be initialized before the module is loaded, and it will miss the on page load events (p.e 'product_view', 'checkout' or 'purchase').
Template Customization
It's essential to customize the theme files to track the product listings and have a much more detailed dynamic remarketing. The process to edit the template is quite simple if you have a basic HTML skills, if you have no experience with HTML contact us through Addons support, and we will offer you a customized solution.
Info
You can edit the files with free programs like Sublime Text, or Note Pad++.
Since Prestashop 1.7 includes the necessary tags for a detailed tracking, but if your products handles variants (color, sizes, etc…) is necessary to edit one template file to achieve a perfect attribute tracking. The file to edit is.
- my-shop.com/themes/your-theme/templates/catalog/_partials/variant-links.tpl
Look for the element <a href="{$variant.url}"
<a href="{$variant.url}" other-properties.... >
Add to this element the attribute data-id-product-attribute="{$variant.id_product_attribute}"
<a href="{$variant.url}" other-properties....
data-id-product-attribute="{$variant.id_product_attribute}"
>
In all the product listings, the module will try to detect the main element defined with the class "ajax_block_product " then it will look for the following properties data-id-product and data-id-product-attribute to identify which product is being interacted with. These properties mentioned above are not defined in the default theme or in most third party themes of versions 1.6 of PrestaShop, for this reason it is necessary to make the customization. The basic files to edit are.
- my-shop.com/themes/my_theme/product-list.tpl
- my-shop.com/themes/my_theme/product-list-colors.tpl
- my-shop.com/themes/my_theme/product.tpl
- my-shop.com/themes/my_theme/products-comparison.tpl
The following examples are summarized to facilitate understanding and visualization, extrapolate the examples with the files of your theme. Remember, you only have to include the data-id-product and data-id-product-attribute with their corresponding value.
This file is responsible for displaying most product listings, home, categories, manufacturers, etc...
We will look for the element that contains the class ajax_block_product the HTML element can be a <li ..., <div .., etc...
<element class="ajax_block_product other_classes...">
At the end of the element we will add the properties: data-id-product="{$product.id_product}" and data-id-product-attribute="{$product.id_product_attribute}"
<element class="ajax_block_product other_classes..."
data-id-product="{$product.id_product}"
data-id-product-attribute="{$product.id_product_attribute}"
>
Note
This module, is capable to track the product list generated by other modules like "homefeatured", "blockbestsellers" etc... You only have to find the template file that includes an ajax_block_product class and add the correct properties as it explain on this section.
In the product listings, it shows a direct link to each color option available in the product. If your products can have this feature, edit the file and look for the unique element <a ... and add the property data-id-product-attribute="{$color.id_product_attribute}"
<a href="{{$link->getProductLink($color.id_product....}">
At the end of the element add the properties: data-id-product="{$product.id_product}" and data-id-product-attribute="{$product.id_product_attribute}"
<a href="{{$link->getProductLink($color.id_product....}"
data-id-product-attribute="{$color.id_product_attribute}"
>
Depending on the theme, the product sheet may have a list of related accessories. If so, we look for the element that contains the class "ajax_block_product" the HTML element can be a "li", "div" , etc ...
<element class="ajax_block_product other_classes">
In this case the properties will be data-id-product="{$accessory.id_product}" and data-id-product-attribute="{$accessory.id_product_attribute}"
<element class="ajax_block_product other_classes"
data-id-product="{$accessory.id_product}"
data-id-product-attribute="{$accessory.id_product_attribute}"
>
Note
If the class "ajax_block_product" doesn't exist on the file, means that the product.tpl of your theme does not use the basic list of accessories, and it will not be necessary to edit this file
This last file is responsible for displaying the product comparison lists. We will look for the element that contains the class "ajax_block_product" the HTML element can be a "li", "div", etc ...
<element class="ajax_block_product other_classes">
In products-comparison.tpl the properties will be data-id-product="{$product->id}" and data-id-product-attribute="{$product->id_product_attribute}"
<element class="ajax_block_product other_classes..."
data-id-product="{$product->id}"
data-id-product-attribute="{$product->id_product_attribute}"
>
If your site has the Elementum module, you must configure the listings template to be able to track the products.
- in PrestaShop Backoffice go to Creative Elements > Theme Builder
- Select in templates list, the template type as Product Miniature
- Click on the Edit with Creative Elements button, and select the language to configure it
- Once editor is loaded, click on settings icon, at the below left corner
- Click on Advanced tab
- On Article Classes input, add the class js-product-miniature
Note
Repeat these steps with all lising templates and with all languages
Configure Tag Managers
Configuring Tag Manager could be pretty difficult without a deep knowledge of the GTM platform and advanced develop skills. For this reason, the guide provides a solution to cover a professional deployment accessible to everyone.
There is 2 ways to configure Tag Manager:
- Implementation: Easier to implement, suitable for most users.
- Performance: Scripts are loaded on the client-side, which can impact page load times.
- Security: Less secure as scripts are exposed to the client-side.
- Data Accuracy: Data is collected as third-party, which can be less accurate due to ad blockers and browser restrictions.
- Implementation: More complex to implement, requires server-side setup.
- Performance: Improves website performance by reducing the load on the client-side.
- Security: More secure as scripts are executed on the server-side, reducing exposure.
- Data Accuracy: Data is collected as first-party, which improves accuracy and reduces the impact of ad blockers and browser restrictions.
Data Processing Amendment
It is essential to accept the Google Ads Data Processing Terms to ensure compliance with data protection regulations and to allow the transfer of data to Google Ads. This is a requirement for all users of Google Ads, including those using Google Tag Manager. Otherwise, you will not be able to send data to Google Ads.
- In your GTM account, click on Admin.
- Click on Account Settings.
- Click on Data Processing Amendment.
- Click on View the Data Processing Amendment and accept the Data Processing Terms.
- Click on Save to save the changes.
Configure Cron Job
This feature is a server task to send missing transactions that for any reason the tracking module can not send it from customer device.
The task will collect all orders placed between current time less 10 minutes to 24h in the past, also the collected orders must meet the next conditions to be eligible for recovery.
- The order id is not in control table, or the control order state is related to missing order
- Current order status doesn't match any invalid or refund statuses set on module configuration Checkout Configuration tab
Warning
The recovery process will send the transaction only to the available API platforms that are properly configured with the tracking ID.
Current API platforms:
- Google Universal Analytics
- Google Analytics 4
Comming Soon API platforms:
- Google Ads
- Bing Ads
- TikTok
- Criteo
Configure The Job
The recommended configuration is fire the job each 10 minutes, this will assure that all missing transactions are recovered with minimal impact on report times.
Note
You will find the cron URL in module configuration Recover Transactions tab. If you have multishop enabled, you must create one cron job for each shop, so be sure you get the correct job url selecting the shop context on backoffice
*/10 * * * * /usr/bin/curl "https://my-shop-domain.com/index.php?fc=module&module=rcpgtagmanager&controller=crontask&token=n0nv4l1d70kenum3er" >/dev/null 2>&1
Tip
The most popular hosting panels are cPanel and Plesk, find official documentation about how to set up a cron job.
if you have any other panel, ask your hosting support how to add a cron job