Skip to content

Commit

Permalink
GTM plugin
Browse files Browse the repository at this point in the history
  • Loading branch information
gmrchk committed Aug 2, 2018
1 parent 6f99d7e commit 85b9343
Show file tree
Hide file tree
Showing 4 changed files with 151 additions and 0 deletions.
115 changes: 115 additions & 0 deletions dist/plugins/swupGtmPlugin.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define([], factory);
else if(typeof exports === 'object')
exports["swupGtmPlugin"] = factory();
else
root["swupGtmPlugin"] = factory();
})(window, function() {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports, __webpack_require__) {

"use strict";


var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };

module.exports = {
name: 'swupGtmPlugin',
options: { runScripts: false },
exec: function exec(options, swup) {
document.addEventListener('swup:contentReplaced', function (event) {
if (_typeof(window.dataLayer) === 'object') {
var object = {
'event': 'VirtualPageview',
'virtualPageURL': window.location.pathname + window.location.search,
'virtualPageTitle': document.title
};

window.dataLayer.push(object);

swup.log('GTM pageview (url \'' + object.virtualPageURL + '\').');
} else {
console.warn('GTM is not loaded.');
}
});
}
};

/***/ })
/******/ ]);
});
1 change: 1 addition & 0 deletions dist/plugins/swupGtmPlugin.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 14 additions & 0 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -410,6 +410,20 @@ window.ga('set', 'page', window.location.pathname + window.location.search);
window.ga('send', 'pageview');
```

### swupGtmPlugin
Google Tag Manager Plugin triggers `VirtualPageview` event on `swup:contentReplaced` (on each page change) which can be associated with a page view within GTM.
Event object also includes `virtualPageURL` holding the url of the page and `virtualPageTitle` holding the title of the page.
Note that this event is not triggered at the first load, so the first page view must be triggered elsewhere.
Simplified code run by this plugin on `swup:contentReplaced`:

```javascript
window.dataLayer.push({
'event': 'VirtualPageview',
'virtualPageURL': window.location.pathname + window.location.search,
'virtualPageTitle': document.title
});
```

## API
The instance of the swup can be imported and used across your sites JavaScript to enable some additional features. When debug mode (see [options](#options) section) is enabled, instance is also available in `window` object as `window.swup`.
We can access some of the information used by swup such as used options:
Expand Down
21 changes: 21 additions & 0 deletions src/plugins/swupGtmPlugin.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
module.exports = {
name: 'swupGtmPlugin',
options: {runScripts: false},
exec: function(options, swup) {
document.addEventListener('swup:contentReplaced', event => {
if (typeof window.dataLayer === 'object') {
let object = {
'event': 'VirtualPageview',
'virtualPageURL': window.location.pathname + window.location.search,
'virtualPageTitle': document.title
};

window.dataLayer.push(object);

swup.log(`GTM pageview (url '${object.virtualPageURL}').`);
} else {
console.warn('GTM is not loaded.')
}
})
}
}

0 comments on commit 85b9343

Please sign in to comment.