SOLVED

Capture URL parameters and use on links

Go to solution
Highlighted
Anonymous
Not applicable

Capture URL parameters and use on links

Hi. I have some landing pages that cannot have forms on them... but they link to other pages with Marketo forms. (It has to be that way, long story.)

On those landing pages, I would like to capture utm parameters from the URL and put it into the links that are on that page.

Is there a way to grab those parameters from the URL and put them into the links on the page?
Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Ah! I got one of my programmers involved, and he devised a bit of code that puts any URL parameters onto every link on the page.

So say "Thanks, Tad" when you use this. Just place it in the "custom meta tags" on a landing page.

<script language="Javascript" src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript" ></script>
<script>
    //Written by Tad from ExploreLearning
if (document.location.search.length) {
jQuery.extend({
  getQueryParameters : function(str) {
 return (str || document.location.search).replace(/(^\?)/,'').split("&").map(function(n){return n = n.split("="),this[n[0]] = n[1],this}.bind({}))[0];
  }
});
$( document ).ready(function() {
    // get qs vars as obj
var qs = $.getQueryParameters();
    //loop all links
    $('a').each(function() {
        //get href
        var hrefParts = $(this).attr('href').split('?');    
        //get copy of qs obj
        var docQS = qs;
        //get href qs vars as obj
        var aQS = $.getQueryParameters(hrefParts[1]);
        //merge together qs objs
        $.extend(docQS, aQS);
        //create new href string
        var newHref = hrefParts[0] + '?' + jQuery.param(docQS);
        //update link href
        $(this).attr('href', newHref);
    });
});
}
</script>

View solution in original post

7 REPLIES 7
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

You'll need to write some JavaScript to pull in the values from the querystrings and add them to content on the page. Without seeing the page and the use case it's hard to point you in the right direction, but here are a couple of links to get you started.

 
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Jason is correct. This is not possible directly within Marketo, and will require custom JavaScript. 
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Thanks, Jason. I got it!

Below is what I did, but it only works for text links. Is there a way to put an onclick event on a graphic?



Here's what I did:

1. I put this code into the custom HTML section:

<script language="Javascript" src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript"></script>
<script>
  var $jQ = jQuery.noConflict();
  var utm_keyword = $jQ.getQueryString({ ID: "utm_keyword" });
  var utm_source = $jQ.getQueryString({ ID: "utm_source" });
  var utm_term = $jQ.getQueryString({ ID: "utm_term" });
  var utm_medium = $jQ.getQueryString({ ID: "utm_medium" });
  var utm_content = $jQ.getQueryString({ ID: "utm_content" });
</script>

2. Inside the <a> tag, I added this at the end:
onclick="location.href=this.href+'?utm_source='+utm_source+'&utm_keyword='+utm_keyword+'&utm_term='+utm_term+'&utm_medium='+utm_medium+'&utm_content='+utm_content;">LINK TEXT</a>

So for example it would be:
<a href="http://ldomain.com/page" onclick="location.href=this.href+'?utm_source='+utm_source+'&utm_keyword='+utm_keyword+'&utm_term='+utm_term+'&utm_medium='+utm_medium+'&utm_content='+utm_content;">LINK TEXT</a>
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Ed, 

Per your question in bold above, you can wrap an image in a link just like you would text, so the onclick event would occur with a click on that image as well.

<a href="#" onclick="$"><img src="/path/to/yourimage.jpg"></a>
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Thanks, Jason. But it then has to be inserted as HTML, not using Marketo's image controls, right?
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Yes, or you can use the Rich Text object for more control.
Highlighted
Anonymous
Not applicable

Re: Capture URL parameters and use on links

Ah! I got one of my programmers involved, and he devised a bit of code that puts any URL parameters onto every link on the page.

So say "Thanks, Tad" when you use this. Just place it in the "custom meta tags" on a landing page.

<script language="Javascript" src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript" ></script>
<script>
    //Written by Tad from ExploreLearning
if (document.location.search.length) {
jQuery.extend({
  getQueryParameters : function(str) {
 return (str || document.location.search).replace(/(^\?)/,'').split("&").map(function(n){return n = n.split("="),this[n[0]] = n[1],this}.bind({}))[0];
  }
});
$( document ).ready(function() {
    // get qs vars as obj
var qs = $.getQueryParameters();
    //loop all links
    $('a').each(function() {
        //get href
        var hrefParts = $(this).attr('href').split('?');    
        //get copy of qs obj
        var docQS = qs;
        //get href qs vars as obj
        var aQS = $.getQueryParameters(hrefParts[1]);
        //merge together qs objs
        $.extend(docQS, aQS);
        //create new href string
        var newHref = hrefParts[0] + '?' + jQuery.param(docQS);
        //update link href
        $(this).attr('href', newHref);
    });
});
}
</script>

View solution in original post