How to make the “Facebook for WooCommerce” plugin work with usercentrics

To comply with GDPR I like to use usercentrics consent management platform. With this cmp it’s easy to set/unset cookies based on the users preferences/settings. To get this to work you have to change the attributes of a script tag. The normal Facebook Pixel Script for example would look like this:

<!-- Facebook Pixel Code -->
<script type="text/javascript">
.
.
.
</script>
<!-- End Facebook Pixel Code -->

To get this to work with usercentrics cmp, you have to edit the code like this:

<!-- Facebook Pixel Code --> 
<script type="text/plain" data-usercentrics="Facebook Pixel"> 
. 
. 
. 
</script> 
<!-- End Facebook Pixel Code -->

Simply changing the script tag attributes is absolutely no problem if you add the Pixel Code yourself. But what about a plugin like Facebook for WooCommerce is adding the code for you, without you having the chance to change the script tag attributes?

First I had a look in the documentation of the plugin to see if there is any filter I can use to change the way the plugin adds the pixel, but I didn’t find what I needed. So I started to have a look at the plugins code and fortunately I found this piece of code in /plugins/facebook-for-woocommerce/facebook-commerce-pixel-event.php:

As you can see there is a function that returns the attributes for the script tags and also a filter you can use:

So you simply have to add the following code to your (child-)themes functions.php:

function change_fb_for_woo_attributes( $custom_attributes ) {
  $custom_attributes = array(
    'type' => 'text/plain',
    'data-usercentrics' => 'Facebook Pixel'
  );
  return $custom_attributes;
}
add_filter( 'wc_facebook_pixel_script_attributes', 'change_fb_for_woo_attributes' );

That’s it! Facebook for WooCommerce will know work with usercentrics cmp.