Data

Tools

Indexes

Applications

Experiments

Awesome

An open API service indexing awesome lists of open source software.

https://github.com/netzstrategen/wordpress-shop-analytics

WordPress integration plugin for Google Analytics.
https://github.com/netzstrategen/wordpress-shop-analytics

analytics google-analytics google-analytics-api javascript php wordpress wordpress-plugin

Last synced: about 2 months ago
JSON representation

WordPress integration plugin for Google Analytics.

Awesome Lists containing this project

README 

        
# Wordpress Shop Analytics

This plugin tracks the activity of customers in WooCommerce based ecommerce sites and sends the collected data to Google Data Layer.



The plugin acts in two general areas:

- __Static Tracking:__ Tracking of information about the page currently displayed.

- __Dynamic Tracking:__ Tracking of the events triggered by the customers as they interact with the site.



In order to implement these functionalities, the plugin relies on Google Tag manager script. The plugin takes care of adding the GTM script in the page, once the required GTM ID is added to its backend configuration settings and the script injection enabled.



The (very) initial concept and requirements description of `shop-analytics` plugin can be found [in this document](https://docs.google.com/document/d/1Wpe4YoVDrdgiXtzfuSmIh36rEpaJ0gM87LMKST8BacQ/edit#heading=h.qu6ahb5mfd10). However, the plugin has grown and considerably evolved in complexity and functionality since then.

## Shop Analytics configuration settings



The plugin has a dedicated configuration settings page (`wp-admin/admin.php?page=shop-analytics`). Upon activation, the plugin adds a `Shop Analytics` entry to the WordPress admin menu.



The available configuration settings are:

- __Google Tag Manager Container ID:__ account ID to be used by Tag Manager script.

- __Google Tag Manager script embed:__ if checked, enabled the injection of the GTM script.

- __TagCommander enabled:__ Enables TagCommander variable optout.

- __Track User ID:__ if checked, user ID is tracked.

- __Use anonymized E-Mail address as User ID:__ if checked, anonymized E-Mail address is applied as user ID.

- __Track User Role:__ if checked, user role is tracked.

- __Disable User Tracking:__ user roles that should not be tracked.

- __Enable E-Commerce tracking:__ if checked, e-commerce related activity is tracked.

- __Market code (fallback value):__ market default code.

- __Enable GA dataLayer console logging:__ if checked, data object pushed to Google Data Layer is printed in the browser console. Useful for debugging purposes.

- __Attribute used as product brand:__ if a product attribute is used to manage product brands (instead of the WooCommerce native brand field), it can be selected here. This is necessary to correctly track products brand.

- __Attribute used as product category:__ if a product attribute is used to manage product categories (instead of regular categories), it can be selected here. This is necessary to correctly track products categories.

## Static Tracking



Several relevant details about the site page displayed are sent to GTM. This is achieved by injecting data attribute fields in the `` tag. [See code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L101).



The data fields can vary depending on the type of page visited. Some data fields are used in all cases.



- __Common data fields:__

  - `language`: Site language.

  - `user-id`: User ID (if logged in).

  - `user-type`: User role.

  - `user-track`: tracking status for current user (`1` means tracked, `0` not tracked).



- __Not commerce related__

  - `page-type`: Page type. Possible values are:

    - Home

    - Page

    - Post

    - Tag

    - Category

    - Search

    - Other

- __Commerce related, if tracking enabled in backend settings:__

  - `page-type`: Page type. Possible values are:

    - Product single

      - Additionally: Product details and attributes.

        - `product-{detail name}`: product details.

        - `product-{attribute name}`: product attributes.

    - Product category, and

      - `product-category`: Category path

      - `product-count`: Products count in current taxonomy.

    - Product tag, and

      - `product-tag`: Tag name,

      - `product-count`: Products count in current taxonomy.

    - Cart

    - Checkout

  - `market`: Market designation.

  - `currency`: Currency in use.



E.g

Homepage

```



```

Content page

```



```



Product category listing

```



```

Single product

```

` and `` elements. This is done during the building and rendering of the page, relying on diverse WooCommerce hooks ([see code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L50)). E.g.



On single product view ([see code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/WooCommerce.php#L379))

```html



```

In cart page ([see code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/WooCommerce.php#L338))

```html



```

In order confirmation page ([see code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/WooCommerce.php#L423))

```html



  




```



When the hidden element is ready, all the required data attribute fields added, a set of scripts take care of retrieve the information, organize it in a DataLayer object, and push it into Google DataLayer.



The JSON object pushed to Google Data Layer has a predefined basic format, which varies depending on the event to be tracked.



E.g.

Products impressions (products listing page, partial data)

```json

{

  "event": "view_item_list",

  "ecommerce": {

    "currency": "EUR",

    "items": [

      {

        "item_name": "4Seasons Outdoor Accor Diningsessel",

        "item_id": "213520-M",

        "price": "294.00",

        "item_category": "Gartenmöbel/Basics/Gartenstühle",

        "item_brand": "4Seasons Outdoor",

        "position": 1,

        "item_list_name": "Product Category"

      },

      {

        "item_name": "4Seasons Outdoor Athena Diningsessel",

        "item_id": "91013",

        "price": "249.00",

        "item_category": "Gartenmöbel/Basics/Gartenstühle",

        "item_brand": "4Seasons Outdoor",

        "position": 2,

        "item_list_name": "Product Category"

      },

      {

        "item_name": "Cane-line Diamond GartenstuhlTextilgewebe",

        "item_id": "8401TXW-M",

        "price": "484.00",

        "item_category": "Gartenmöbel/Basics/Gartenstühle",

        "item_brand": "Cane-line",

        "position": 3,

        "item_list_name": "Product Category"

      },

      {



      }

    ]

  },

  "gtm.uniqueEventId": 12

}

```

Single product view

```json

{

  "event": "view_item",

  "ecommerce": {

    "items": [

      {

        "item_name": "4Seasons Outdoor Accor Diningsessel",

        "item_id": "213520-M",

        "price": "294.00",

        "item_category": "Gartenmöbel/Basics/Gartenstühle",

        "item_brand": "4Seasons Outdoor",

        "item_list_name": "Product detail"

      }

    ]

  },

  "gtm.uniqueEventId": 12

}

```



Add product(s) to cart

```json

{

  "event": "add_to_cart",

  "ecommerce": {

    "currency": "EUR",

    "items": [

      {

        "item_name": "4Seasons Outdoor Accor Diningsessel",

        "item_id": "280274",

        "price": "294.00",

        "item_category": "Gartenmöbel/Basics/Gartenstühle",

        "item_brand": "4Seasons Outdoor",

        "item_variant": "Rope anthrazit",

        "quantity": 1

      }

    ]

  },

  "gtm.uniqueEventId": 48

}

```

The events tracked are:

- Navigation

  - [Click on navigation element](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L433)

- User

  - [New user registration](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L401)

  - [New user registration during checkout](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L414)

  - [User login](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L388)

- Products listings

  - [Product impressions](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L226)

  - [Click on product](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L302)

- Single product

  - [View single product page](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/product.js#L16)

  - [Add product to cart](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L341)

  - [Update product quantity](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/product.js#L48)

  - [Product variation selection](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/product.js#L57)

  - [Show product gallery](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/product.js#L77)

- Cart

  - [Update cart totals](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L36)

  - [Update product quantity in cart](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L36)

  - [Remove product from cart](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L459)

  - [Empty cart](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L424)

- Checkout

  - [Update shipping method](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L36)

  - [Update payment method](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L36)

  - [Update billing address](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L36)

  - [Update shipping address](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L108)

  - [Order placed](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/cart-checkout.js#L72)

  - WooCommerce checkout enpoints ([See code](https://github.com/netzstrategen/wordpress-shop-analytics/blob/3f326907a7bb49db30b67cc9bd0c3538850d93b5/src/Plugin.php#L281)), represented with an integer value (default values can be [modified with a filter](#backend)).

    - `view-order`

    - `edit-account`

    - `edit-address`

    - `lost-password`

    - `customer-logout`

    - `add-payment-method`

    - `order-pay`

    - `order-received`



## Code customization



### Backend

Code customization is possible using the provided filters:

- [shop_analytics_product_meta_key_gtin](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/WooCommerce.php#L85): allows to modify the name (value of `meta_key`) of the meta field used to store the products GTIN.

- [shop_analytics_checkout_steps](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L276): allows to modify the integer used to represent each WooCommerce checkout step.

- [shop_analytics_wc_endpoints](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L281): allows to modify the integer used to represent each WooCommerce endpoint.

- [shop_analytics_checkout_step__view_cart](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L301): allows to modify the integer used to represent WooCommerce `view_cart` checkout step.

- [shop_analytics_checkout_step__checkout_pay](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L305): allows to modify the integer used to represent WooCommerce `pay` checkout step.

- [shop_analytics_checkout_step__checkout_page](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L308): allows to modify the integer used to represent WooCommerce `checkout_page` checkout step.

- [shop_analytics_checkout_step_current](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/src/Plugin.php#L308): allows to modify the integer passed to the frontend to represent WooCommerce current checkout step.



### Frontend (JS)

It is possible to override many default values modifying the entries of the properties of the object `shopAnalytics`, which is [added to the browser document object as a property](https://github.com/netzstrategen/wordpress-shop-analytics/blob/5b410895b76599adf24ada7feac5733c71c42c95/assets/scripts/datalayer/common.js#L129-L180). This allows to customize the selectors used to trigger some dynamic tracking events, if necessary.