How to Setup Facebook Conversion Tracking with Shopp

In this post we’ll take a look at getting Shopp running with Facebook conversion tracking. This works by using a conversion pixel which fires after a successful checkout on the Shopp thanks page.

You’ll need an FTP client to complete this tutorial. We recommend the Transmit FTP client which is available for the Mac. If you aren’t using a Mac, then try FileZilla is an alternative option.

Here is an example of what the code snippet for Facebook’s conversion pixel:

<script type="text/javascript">
var fb_param = {};
fb_param.pixel_id = '1234567890123';
fb_param.value = '0.00';
(function(){
 var fpw = document.createElement('script');
 fpw.async = true;
 fpw.src = '//connect.facebook.net/en_US/fp.js';
 var ref = document.getElementsByTagName('script')[0];
 ref.parentNode.insertBefore(fpw, ref);
})();
</script>
<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/offsite_event.php?id=1234567890123&value=0" /></noscript>

When it runs, it will tell Facebook that an event has occurred for a certain amount. Note that the value “1234567890123″ is an example and not a real value. The same applies for “0.00.”

We’ll need to wrap this script in a function that runs only after checkout has completed and a customer has arrived on the thanks page.

Add the JavaScript Code to the Functions.php file

1) Login to the site with your FTP client. We recommend Transmit (for Mac).

2) Then go to your theme folder and locate the functions.php file. This is generally wp-content/themes/yourthemefolder/

3) Open the functions.php file

4) Copy the revised coding below:

function add_facebookconversionpixel() {
 if (function_exists('is_shopp_page') & is_thanks_page()) {
 ?>
 <script type="text/javascript">
 var fb_param = {};
 fb_param.pixel_id = '1234567890123';
 fb_param.value = '<?php echo floatvalue(shopp('purchase.get-total')); ?>';
 (function(){
 var fpw = document.createElement('script');
 fpw.async = true;
 fpw.src = '//connect.facebook.net/en_US/fp.js';
 var ref = document.getElementsByTagName('script')[0];
 ref.parentNode.insertBefore(fpw, ref);
 })();
 </script>
 <noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/offsite_event.php?id=1234567890123&value=<?php echo floatvalue(shopp('purchase.get-total')); ?>" /></noscript>
</script>
<?php 
}
}
add_action('wp_footer', 'add_facebookconversionpixel');

5) Next, you’ll need to change the value of “1234567890123″ to your actual pixel id.

6) Save changes to your functions.php file.

Now return to your store and run a test by purchasing an item from your store. Shortly afterwards, you should see the information reported in your Facebook Ads Manager.

Notes: View the documentation for Facebook conversion tracking. You can retrieve the order subtotal by using purchase.get-subtotal instead of purchase.get-total.