Add 3rd party pixel

[aleber]

Hello,

I need to add some custom 3rd party pixel by Data Collection (former Adobe Launch).

Any suggestion about best practices?

Any example of code or tutorial to add it?

I assume that it is possible by custom code on a rule, is it correct?

Many Thanks,

Alex

[Jennifer_Dungan]

That is generally how I do it. If it's a pixel that fires on every page, then I will often just add a custom code after my Adobe Analytics tracking to trigger it with the same "fundamental" tracking rule... if it requires a custom trigger, then I will create a new rule.

Depending on how confident you are with Javascript, I will often put some general logic into my custom code for the pixel in my fundamental tracking... for example, FB pixels... we have a pixel on each page, and some additional pixels for page-level conversions.

I will use one custom code on my fundamental rule to initialize the pixel, trigger the standard pv pixel, and then I use some code to determine if I am on a conversion page and then trigger the conversion... this keeps the code in one place so I don't have to jump around a lot to find all the places if I need to make changes. But if you don't feel confident in making those checks, then just create a rule with the specific condition. Either way is equally valid. No matter how you do the code, it should all be tested to ensure its triggering at the correct time(s) and with the correct values.

Best Practice Tip:

If you haven't already, it can also help to you a data element for the values, and inject them into your code... if you need to make account changes - you can do so from the data element, rather than all the places in the pixel tracker code, and if you ever use this code for a complex "multi-site setup", you can just change the static value ID into a lookup or something that will change to support multiple sites (or allow you to copy the entire rule and data attribute to another Launch property, and making the updates for the new property super easy).

The most important thing is doing something that works for you, and that it's easy to manage! Everyone does stuff a little differently... what works for me may not work for you, and vice versa. That's also one of the best parts about Adobe Launch, it gives a lot of leeway and freedom to customize a solution that works for you.

Depending on how many rules you have doing different things, sometimes I will even add (AA, FB, etc) to the end of each rule name... so if I need to pull up all the rules that interact with Facebook pixels, I can search for "FB" rather than trying to remember all the name variations that might exist (and of course, generic rules like "Fundamental Tracking" or "General Page Views" or whatever naming convention you are using, it can be easy to forget what all is part of that rule.)

[aleber]

Hi,

do you have any example of custom code?

Alex

[Jennifer_Dungan]

Again, this will really depend on what type of pixel you are using, and the code will be specific (with a few modifications) to that pixel.

For instance, I like to initialize my variables at the start (I pull the data element values using _satellite.getVar(), just so I can use a nice short name in the code) and I like to add try/catch to ensure that if something fails, it fails more gracefully. Then I determine in one chunk of code (for page level tracking) based on page type, what pixels will fire...

In this sample:

• Add the providers code to the page (technically this is optional, if your developers already have the providers code on the site, then you may not need this... but odds are, you are trying to add completely new pixel(s)
• Trigger the init (you may want to add some code to check if the pixel has already been initialized
• Trigger the standard "pageview" pixel
• Check page type
  • if "article" then trigger the view content pixel
  • if it's a "purchase-success" then trigger a purchase pixel
  • if it's "another-page" then trigger a custom pixel

var pixelId = _satellite.getVar('PixelId');
var pageType = _satellite.getVar('PageType');

try {
  !function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
  n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
  document,'script','https://connect.facebook.net/en_US/fbevents.js');
}
catch (e){
}

fbq('init', pixelId);
fbq('track', 'PageView');

if (pageType === "article"){ 
  fbq('track', 'ViewContent'); 
} 
else if (pageType === "purchase-success"){ 
  fbq('track', 'Purchase', {value: 0.00, currency: 'USD'});
}
else if (pageType === "another-page"){
  fbq('trackCustom', 'CustomEvent', {value: "x"}); 
}

If I need to trigger multiple different types of pixels on the same pages, I can use the same structure... but in that case I may want to wrap the main code for each pixel in it's own try/catch, then use the same if statement to drive the pixels like:

var fbPixelId = _satellite.getVar('FBPixelId');
var twitterPixelId = _satellite.getVar('TwitterPixelId');
var otherPixelId = _satellite.getVar('OtherPixelId');
var pageType = _satellite.getVar('PageType');

// FB Code
try {
  !function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
  n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
  n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
  t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
  document,'script','https://connect.facebook.net/en_US/fbevents.js');
}
catch (e){
}

// Twitter Code
try {
  !function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments);
    },s.version='1.1',s.queue=[],u=t.createElement(n),u.async=!0,u.src='//static.ads-twitter.com/uwt.js',
    a=t.getElementsByTagName(n)[0],a.parentNode.insertBefore(u,a))}(window,document,'script');
}
catch (e){
}

// Other Code
try {
  // code from other service here
}
catch (e){
}

fbq('init', fbPixelId);
fbq('track', 'PageView');
twq('init',twitterPixelId);
twq('track','PageView');
// Init and PV trigger for "otherPixel" here

if (pageType === "article"){ 
  fbq('track', 'ViewContent'); 
  // there no specific pixels here, so only FB is loaded
} 
else if (pageType === "purchase-success"){ 
  fbq('track', 'Purchase', {value: 0.00, currency: 'USD'});
  // Add other pixel "purchase" event here
}
else if (pageType === "another-page"){
  fbq('trackCustom', 'CustomEvent', {value: "x"}); 
  // Add other pixel "custom event" here
}

For pixels that trigger on clicks, you could use similar code to above... but remember, the code should already be on the page and has been initialized... so you would only need to trigger the pixel, and your clicks would already be specifically targeted so you probably won't need the if statements, unless there is some extra logic to only fire on the clicks under certain conditions.

If you use the extension as suggested, I don't know of any "all in one / generic" extension, since each system has its own code and syntax.

Extensions are a valid way to add the code, but for my uses, I didn't really want to install multiple extensions and create a lot of different rules to trigger all our pixel needs (and this is assuming that there is an extension for everything you need... major players like FB and Twitter have extensions, but some other systems may not)

Whichever way you go, I'm sure you will get it working in no time.

[Madhusudan_S]

Hi @aleber ,

Why dont you try Launch extension there is steamless and errorfree process . i would like to suggest use extension.

Thanks & Regards,

Madhusudan Sura

[aleber · Accepted solution]

Hi,

can you suggest any general purpose extension?

Alessandro