Actually, you should not exclude all parameters, because some are crucial to Google Analytics to work properly, as for example gclid
-parameters or utm_
-parameters.
Page location without params when you know the query parameter
- first, create the JS function
cleanPageLocation()
before the Google Analytics snippet runs. Add the names of the parameters to exclude to the excludeStrings
array.
- Then add it to the GA snippet as shown below
<script>
function cleanPageLocation() {
// define parameters to exclude
var excludeStrings = [
"lname",
"fname"
];
var addressString = new URL(document.location);
var queryString = addressString.search;
/* check if query string holds any parameters, otherwise just return the url without them */
if (queryString.indexOf("?") != -1) {
/* https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript */
var getQueryParamsFromURL = function getQueryParamsFromURL() {
var match,
search = /([^&=]+)=?([^&]*)/g,
decode = function decode(s) {
return decodeURIComponent(s);
},
query = addressString.search.substring(1);
var urlParams = {};
while ((match = search.exec(query))) {
urlParams[decode(match[1])] = decode(match[2]);
}
return urlParams;
};
// create param object from query string
var urlParams = getQueryParamsFromURL();
/* if it holds any of the defined parameters, remove the key and keep the rest */
Object.keys(urlParams).map(function (key) {
if (excludeStrings.includes(key)) delete urlParams[key];
});
// Create filtered query string
var queryString = new URLSearchParams(urlParams).toString();
// add ? to querystring unless it's empty
if (queryString != "") queryString = "?" + queryString;
}
// return cleaned URL
return addressString.origin + addressString.pathname + queryString;
}
</script>
Page location without params when you don't know the query parameter to exclude
in that case you exclude all query parameters, except the ones that Google Analytics needs: gclid
, anything with utm_
and maybe gtm_debug
update the includeStrings
array as needed
<script>
function cleanPageLocation() {
// define parameters to keep if available
var includeStrings = [
"gclid",
"utm_",
"gtm_debug"
];
var addressString = new URL(document.location);
var queryString = addressString.search;
/* check if query string holds any parameters, otherwise just return the url without them */
if (queryString.indexOf("?") != -1) {
// transpile ES2016 => ES2015
var _defineProperty = function (obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
};
/* https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript */
var getQueryParamsFromURL = function getQueryParamsFromURL() {
var match,
search = /([^&=]+)=?([^&]*)/g,
decode = function decode(s) {
return decodeURIComponent(s);
},
query = addressString.search.substring(1);
var urlParams = {};
while ((match = search.exec(query))) {
urlParams[decode(match[1])] = decode(match[2]);
}
return urlParams;
};
var filterParamsFromList = function filterParamsFromList(obj, list) {
var urlParamKeysFinal = [];
var urlParamKeys = Object.keys(obj);
/* test each param for availability and create array with final keys */
for (var i = 0; i < list.length; i++) {
urlParamKeysFinal.push(
urlParamKeys.filter(function (key) {
return key.includes(list[i]);
})
);
}
// merge all keys into one list
/* https://stackoverflow.com/questions/10865025/merge-flatten-an-array-of-arrays */
urlParamKeysFinal = [].concat.apply([], urlParamKeysFinal);
return urlParamKeysFinal.reduce(function (cur, key) {
return Object.assign(cur, _defineProperty({}, key, obj[key]));
}, {});
};
// create param object from query string
var urlParams = getQueryParamsFromURL(); /* Create filtered query string */
queryString = new URLSearchParams(
// remove any non-matching keys from param object
filterParamsFromList(urlParams, includeStrings)
).toString();
// add ? to querystring unless it's empty
if (queryString != "") queryString = "?" + queryString;
}
// return cleaned URL
return addressString.origin + addressString.pathname + queryString;
}</script>
Add cleanPageLocation() to Google Analytics snippet
(function(i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject']=r;
i[r]=i[r]||function() {
(i[r].q=i[r].q||[]).push(arguments)
}, i[r].l=1*new Date();
a=s.createElement(o), m=s.getElementsByTagName(o)[0];
a.async=1;
a.src=g;
m.parentNode.insertBefore(a,m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', '@gaToken', 'auto');
ga('send', 'pageview', cleanPageLocation());
source: https://bluerivermountains.com/en/ga4-query-parameter-exclusion