[Guide] Persist UTMs and pass them to a subdomain or other website.

Sean Gowing
December 7, 2022
[Guide] Persist UTMs and pass them to a subdomain or other website.

So, one interesting problem that has come up recently was how to persist UTMs and then pass them to an application that lives on a subdomain. I was tasked with coming up with a solution to this problem. I flexed my Google Fu and discovered this article by Analytics Mania. Thank you Julius, this code became the basis for my solution.

The problem with UTMs is if you don't save them, you lose them past the first click.  This is where Local Storage comes in handy. We can just grab the UTMs and store them for later use.   This code checks for the domain that you want to pass the UTMs to and then applies it via JavaScript to the anchor tag so that the UTMs will pass. In my example I am targeting my application which lives at app.mysite.com. When I click the login link to my application I want my UTMs to go with the click so that I can capture them into my application side of my funnel. This gives you Top of Funnel and Meets Bottom of Funnel. A perfect solution to measure campaign success and true ROI.

Onto the reason you are here.  The code.

      (function () {
        function getUTM() {
          let params = {};
          const searchParams = new URLSearchParams(window.location.search);
          searchParams.forEach((value, key) => {
            params[key] = value;
          localStorage.setItem("params", JSON.stringify(params));
        //adding this conditional check means the code wont overwrite the values once they are set.
        if (localStorage.getItem("params")) {
          if (localStorage.getItem("params").length > 3) {
            console.log("do nothing");
        } else {
          console.log("run utms");

        queryParams = [
          "utm_medium", //add or remove query parameters you want to transfer
        domainsToDecorate = ["app.session.com", "test.com"];
        // do not edit anything below this line
        const links = document.querySelectorAll(".outbound");
        // check if links contain domain from the domainsToDecorate array and then decorates
        if (localStorage.getItem("params").length > 3) {
          for (var linkIndex = 0; linkIndex < links.length; linkIndex++) {
            for (
              var domainIndex = 0;
              domainIndex < domainsToDecorate.length;
            ) {
              if (
                links[linkIndex].href.indexOf(domainsToDecorate[domainIndex]) >
                  -1 &&
                links[linkIndex].href.indexOf("#") === -1
              ) {
                links[linkIndex].href = decorateUrl(links[linkIndex].href);

        // decorates the URL with query params
        function decorateUrl(urlToDecorate) {
          urlToDecorate =
            urlToDecorate.indexOf("?") === -1
              ? urlToDecorate + "?"
              : urlToDecorate + "&";

          var obj = JSON.parse(localStorage.getItem("params"));
          var collectedQueryParams = Object.keys(obj).map((key) => {
          for (
            var queryIndex = 0;
            queryIndex < queryParams.length;
          ) {
            if (queryParams[queryIndex]) {
                queryParams[queryIndex] + "=" + queryParams[queryIndex]
          return urlToDecorate + collectedQueryParams.join("&");

Written By
Sean Gowing
CEO of SocialCatnip
Need help?

Contact Us

Reach out to us today. We are always working to improve our services so you can stay on top of your digital marketing goals. Simply fill out our online form to get jump-start your digital marketing today!

Contact submission will be responded to within 24 hours. Thank you for reaching out to us.

Fields marked with an asterisk (*) are required.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.