magepal / magento2-google-tag-manager

Google Tag Manager is a user-friendly, yet powerful and cost-effective solution that is a must-have integration for every Magento store. It simplifies the process of adding and managing third-party JavaScript tags. With dozens of custom events and hundreds of data points our extensions the #1 GTM solution for Magento.

Home Page:https://www.magepal.com/google-tag-manager.html

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Instant Purchases not tracking

vetshopdeveloper opened this issue · comments

Hi,
When performing an instant checkout from a product page the order/transaction is not sent to Google.

Please see the data layer

window.dataLayer = window.dataLayer || [];
dataLayer.push({"ecommerce":{"currencyCode":"USD"},"pageType":"catalog_product_view","list":"detail","product":{"id":"300","sku":"92-43166","name":"Cuz Toys","price":4.83,"attribute_set_id":"4","path":"Dog Supplies > Toys > Cuz Toys"}});

Magento version #: 2.2.6

Edition (EE, CE, OS, etc): OS

Expected behavior: eCommerce Data to be sent to Google

Actual behavior: The sale is not recognized

Steps to reproduce: perform an instant checkout on Magento 2

Preconditions

NGINX, PHP-FPM, Varnish, Reddis. Ubunto LTS16

We will look into this shortly

We will look into this shortly

Thank you

@srenon any update on this issue?

@vetshopdeveloper ... After spending a few minutes reviewing the implementation of Instant Purchases on 2.2.5 my conclusion is that it is not that developer friendly.

I'm not sure when we will have free time to fit this in our products roadmap. You could always do a paid feature request and we could rearrange our current projects.

Pull request are always welcome and you should be able to add this feature by following these steps

  1. To get the order ID, you could create an after plugin for "placeOrder" in /app/code/Magento/InstantPurchase/Model/PlaceOrder.php and store this information in a session or in a newly created class see eg https://github.com/magepal/magento2-gmail-smtp-app/blob/master/Model/Store.php

  2. Create an after plugin for "execute" in app/code/Magento/InstantPurchase/Controller/Button/PlaceOrder.php. Get and look the Order Id in Step 1 and append your GA data to the JSON by decode and append new data and then return the newly re-encode data.

  3. Then create a JavaScript mixin for "instantPurchase" in app/code/Magento/InstantPurchase/view/frontend/web/js/view/instant-purchase.js and if the GA data exist. This may not work because you may have to rewrite the function to get access to the json object.

Another option would be to create an events listener for "ajaxComplete"

See app/code/Magento/Customer/view/frontend/web/js/customer-data.js

Update "settings.url.match" to the URL for instant purchase and "enhancedecommerce" contain the GA data.

        $(document).on('ajaxComplete', function (event, xhr, settings) {

            if (settings.url.match(/\/checkout\/cart\/add/i)) {

                if (_.isObject(xhr.responseJSON) && !_.has(xhr.responseJSON, 'backUrl') && !_.isEmpty(_.pick(xhr.responseJSON, ['enhancedecommerce']))) {
                    var enhancedecommerce = xhr.responseJSON['enhancedecommerce'];

                    dataLayer.push({
                        'event': 'addToCart',
                        'ecommerce': {
                            'add': {
                                'products': enhancedecommerce
                            }
                        }
                    });

                }
            }
        });