Block external scripts from loading or setting cookies

As you might know you cannot execute certain Third party scripts before a website visitor has actively consented to the Advertising/marketing category. In order to comply to this ruling you would need to change your third party tracking scripts on your website.
In this article you will read on what to do with those scripts in order for our banner to be fully compliant. You will have full control over your scripts and where they are executed.

• Look up the scripts being used on your website. These might be advertising pixels, chat scripts or other integrations you might use for marketing, statistics or other purposes. For this example I use the setting up of a Facebook pixel.
  
  You will receive this code from Facebook to embed the pixel on your website.

  <!-- Facebook Pixel Code -->
  <script>
  !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');
   fbq('init', 'XXXXXXXXXXXXXX'); 
  fbq('track', 'PageView');
  </script>
  <noscript>
   <img height="1" width="1" 
  src="https://www.facebook.com/tr?id=XXXXXXXXXXXXX&ev=PageView
  &noscript=1"/>
  </noscript>
  <!-- End Facebook Pixel Code -->

   

• To add this code GDPR compliant to your website we would need to assign it to a category of cookies. In this case the Facebook pixel is third party advertising cookie.
  We would need to change the <script> tag here on top of the code to the following:
  
  Please pay attention to the part where you edit the “type=text/plain“ you need to change this or add this to your script to make sure it is only executed when a certain category is accepted.
  
  For advertising/marketing we use

<script type="text/plain" data-cookiefirst-category="advertising">Your script here</script>

For functional scripts we use

<script type="text/plain" data-cookiefirst-category="functional">Your script here</script>

For necessary scripts we use

<script type="text/plain" data-cookiefirst-category="necessary">Your script here</script>

For performance scripts we use

<script type="text/plain" data-cookiefirst-category="performance">Your script here</script>

In the end our Facebook pixel script will look like this:

<!-- Facebook Pixel Code -->
<script type="text/plain" data-cookiefirst-category="advertising">
!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');
fbq('init', 'XXXXXXXXXXXXXX');
fbq('track', 'PageView');
</script>
<noscript>
<img height="1" width="1"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXX&ev=PageView
&noscript=1"/>
</noscript>
<!-- End Facebook Pixel Code -->

In order to be fully compliant you would need to change the appropriate scripts on your website.