Measuring Registrations or New Subscriptions From Paid Social Campaigns
How to track Paid Acquisition Campaigns with Pico
When running paid acquisition to direct new sign-up or subscribers to your site through Facebook or Google, it's possible to track the effectiveness of the campaign.
Measure an accurate return on ad spend (ROAS) from your campaigns.
Pico records UTM parameters (source, campaign, medium, content) that were included on a users initial load on your site, for both sign up and payment events.
This data is stored in the Pico CRM and is available in the CSV export, which can allow you to identify the source of conversions. It is possible for the signup UTM and payment UTM to be different, if they occurred on different user sessions.
Firing Conversion Events on Remarketing Pixels
For acquisition strategies that support changing live campaigns based on conversion events, e.g. those that stop targeting users that have already subscribed to Pico through the campaign, it's possible using additional javascript onsite.
This is an advanced integration, and requires javascript development, though we have a code example below. This relies on Signals, to identify when site visitors have converted to registered contacts or paying subscribers, in combination with a browser cookie to only send the conversion event once.
- You'll need to create an element that has the PicoSignal class, in the code snippet's example, this is on a div.
- Add the code snippet below to your site. In this example, both Facebook and Google conversion tracking code is shown. Others can be included in the fireTrackingEvents() method. To track events against Google Analytics, you'll need to have GA code installed on your site elsewhere. Where it says {your-pixel-id-goes-here} within the Facebook code, replace with your pixel id from Facebook as defined:
https://developers.facebook.com/docs/facebook-pixel/implementation#base-code
var adCampaignPicoHandler = function(){<br style="box-sizing:inherit;">&nbsp; &nbsp; var REGISTERED_EVENT_CAPTURED = "ad-reg-event-captured";<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; var PAID_EVENT_CAPTURED = "ad-paid-event-captured";<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; function setCookie(name,value,days) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; var expires = "";<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; if (days) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var date = new Date();<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; date.setTime(date.getTime() + (days*24*60*60*1000));<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; expires = "; expires=" + date.toUTCString();<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; document.cookie = name + "=" + (value || "") &nbsp;+ expires + "; path=/";<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; } <br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; function getCookie(name) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; var nameEQ = name + "=";<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; var ca = document.cookie.split(';');<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; for(var i=0;i < ca.length;i++) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var c = ca[i];<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; while (c.charAt(0)==' ') c = c.substring(1,c.length);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; return null;<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; function fireTrackingEvents(){<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;fireFBevent(event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;fireGAevent(event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;//Other Tracking events can go here.<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp;function fireGAevent(){<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; ga('send', 'event', event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; function fireFBevent(){<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp;!function(f,b,e,v,n,t,s)<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp;{if(f.fbq)return;n=f.fbq=function(){n.callMethod?<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;n.callMethod.apply(n,arguments):n.queue.push(arguments)};<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;n.queue=[];t=b.createElement(e);t.async=!0;<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;t.src=v;s=b.getElementsByTagName(e)[0];<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;s.parentNode.insertBefore(t,s)}(window, document,'script',<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;'https://connect.facebook.net/en_US/fbevents.js');<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp;fbq('init', '{your-pixel-id-goes-here}');<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp;fbq('trackSingleCustom', '{your-pixel-id-goes-here}', event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; var element = document.querySelector('div.PicoSignal');<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; var event = null<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; var observer = new MutationObserver(function(mutations) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; var hasSentRegistered = getCookie(REGISTERED_EVENT_CAPTURED);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; var hasSentPayment = getCookie(PAID_EVENT_CAPTURED);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; mutations.forEach(function(mutation) {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (mutation.type == "attributes" &amp;&amp; mutation.attributeName == "data-pico-status") {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(element.getAttribute("data-pico-status") == "registered" &amp;&amp; !hasSentRegistered){<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; event = "Registered"<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; fireTrackingEvents(event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; setCookie(REGISTERED_EVENT_CAPTURED,1,3650) <br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; else if(element.getAttribute("data-pico-status") == "paying" &amp;&amp; !hasSentPayment){<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;event ="Paying"<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;fireTrackingEvents(event);<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; setCookie(PAID_EVENT_CAPTURED,1,3650) <br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; });<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; });<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; observer.observe(element, {<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; &nbsp; attributes: true<br style="box-sizing:inherit;">&nbsp; &nbsp; &nbsp; });<br style="box-sizing:inherit;">&nbsp; &nbsp; }<br style="box-sizing:inherit;">&nbsp; &nbsp; <br style="box-sizing:inherit;">&nbsp; &nbsp; window.addEventListener('pico.loaded', adCampaignPicoHandler)<br style="box-sizing:inherit;">&nbsp; &nbsp; adCampaignPicoHandler()For help setting up a Facebook or Google campaign to direct more traffic to your site, please reach out to Pico Support and we'll put you in contact with our partners.