Jump to content

PrivacyWire - Cookie Management & async external asset loading


joshua

Recommended Posts

I stumbled upon a thing that might be a bug. I want to embed this podcast player:

<script class="podigee-podcast-player" data-src="https://player.podigee-cdn.net/podcast-player/javascripts/podigee-podcast-player.js" data-configuration="..."></script>

I am using the following code:

<script type="text/plain" data-type="text/javascript" class="podigee-podcast-player" data-ask-consent="1" data-category="external_media" data-src="https://player.podigee-cdn.net/podcast-player/javascripts/podigee-podcast-player.js" data-configuration="..."></script>

The placeholder is appearing just fine, but when the user accepted the cookie, I only get this:

<script data-configuration="..." type="text/javascript" src="https://player.podigee-cdn.net/podcast-player/javascripts/podigee-podcast-player.js" async=""></script>

The class attribute (class="podigee-podcast-player") is getting removed and therefore the player will not load. I guess that this is not the intended behavior?

Cheers,
Flo

  • Like 1
Link to comment
Share on other sites

@snck had the same problem.

And found out, that podigee-player is DSGVO compliant. At least they say it here.

Bu I usually use a div wrapper for iframe embeds, so the classes do not get mixed up or replaced. But there is no way if you have to use the script tag.

Link to comment
Share on other sites

  • 3 weeks later...

Hi,

I've decided to try this module, but somehow I got errors

  •  Skipped field 'cookie_groups' because module 'InputfieldAsmselect' does not exist
     Skipped field 'content_banner_text' because module 'InputfieldCkeditor' does not exist
     Skipped field 'content_banner_details_text' because module 'InputfieldCkeditor' does not exist
     Skipped field 'content_banner_privacy_link' because module 'InputfieldUrl' does not exist
     Skipped field 'content_banner_imprint_link' because module 'InputfieldUrl' does not exist
     Skipped field 'ask_consent_message' because module 'InputfieldCkeditor' does not existin
  •  

    in my config I do have "$config->dbLowercaseTables = true;"

    Kind regards,
     - Igor

Link to comment
Share on other sites

  • 1 month later...
  • 1 month later...
  • 4 months later...

Can anyone explain the changes with the Google consent mode v2? Do we need to change all the Google Tag Manager snippets that we modified for PrivacyWire in the past? Do we have to and should we and can we somehow distinguish between consent for «Statistics» and «Marketing» withiin one GTM?

Link to comment
Share on other sites

  • 4 weeks later...
  On 3/15/2024 at 10:14 AM, nuel said:

Can anyone explain the changes with the Google consent mode v2? Do we need to change all the Google Tag Manager snippets that we modified for PrivacyWire in the past? Do we have to and should we and can we somehow distinguish between consent for «Statistics» and «Marketing» withiin one GTM?

Expand  

Same question here ? 

As far as I understand the docs https://developers.google.com/tag-platform/security/guides/consent?hl=de&consentmode=advanced it's necessary to set & update the "consent status"

Here's a snippet as google recommends on its website.

<script>
// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

// Set default consent to 'denied' as a placeholder
// Determine actual values based on your own requirements
gtag('consent', 'default', {
  'ad_storage': 'denied',
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'analytics_storage': 'denied'
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID

">
</script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());
  gtag('config', 'TAG_ID');
</script>

<!-- Create one update function for each consent parameter -->
<script>
  function consentGrantedAdStorage() {
    gtag('consent', 'update', {
      'ad_storage': 'granted'
    });
  }
</script>
<!-- Invoke your consent functions when a user interacts with your banner -->
<body>
  ...
  <button onclick="consentGrantedAdStorage">Yes</button>
  ...
</body>

I'm thinking about using PrivacyWire for triggering a custom js function: Passing the necessary gtag parameters to google after the user had interacted with the Consent Banner.

@joshua Is it possible to define multiple data-categories at the same time – e.g.:
 

<script type="text/plain" data-type="text/javascript" data-category="statistics|marketing|external_media">
	// Load GTM
</script>

 

  • Like 1
Link to comment
Share on other sites

<script>
      function gtag() {
        dataLayer.push(arguments);
      }

      gtag('consent', 'default', {
        'ad_storage': 'denied',
        'ad_user_data': 'denied',
        'ad_personalization': 'denied',
        'analytics_storage': 'denied'
      });
    </script>
    <script type="text/plain" data-type="text/javascript" data-category="statistics">
      window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}

  gtag('consent', 'update', {
    'analytics_storage': 'granted'
  });
</script>
 <script type="text/plain" data-type="text/javascript" data-category="statistics">
 // GTM
</script>

I use GTM only for Statistics, this is how it work for me.

  • Like 3
Link to comment
Share on other sites

  • 2 weeks later...

I haven't dug too deeply into this yet, but is I saw there is supported integration with TextformatterVideoEmbed - I'm wondering if this could apply to either TextformatterOembed / FieldtypeOembed postprocessing as well, or if that requires more fine tuning because of how different providers may offer different embedded content.

Perhaps all of these fall under external-media?

Link to comment
Share on other sites

  • 4 weeks later...

I have to implement Google Consent v2 together with PrivacyWire for the first time. I tried to summarize the most imporant things and make a quick example. Hope that helps. Improvements welcome.

  • Basically Google wants you to send the user preferences. This way Google can process at least anonymized data if the user denies permissions (and promises to respect privacy).
  • Luckily PrivacyWire gives us the possibility to define a custom js function in the module configuration, which is executed whenever user preferences change.
  • PrivacyWire stores user preferences in localStorage. From there we can fetch this information when needed. So we have to:

1. Integrate Google Tag Manger without modifying the script tag.

2. Set Consent v2 defaults (by default deny every permission):

<!-- GOOGLE CONSENT V2 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GTM-ID-HERE"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('consent', 'default', {
    'ad_storage': 'denied',
    'analytics_storage': 'denied',
    'ad_user_data': 'denied',
    'ad_personalization': 'denied'
  });

  gtag('js', new Date());
  gtag('config', 'GTM-ID-HERE');
</script>
<!-- End GOOGLE CONSENT V2 -->

3. Use a function called by PrivacyWire, when user changes preferences. Fetch user preferences from localStorage and send them to Google:

function updateConsentFromPrivacyWire() {
  console.log('update consent from privacy wire...');
  const privacyWireData = localStorage.getItem('privacywire');
  if (privacyWireData) {
    try {
      const consentData = JSON.parse(privacyWireData);
      const consentPreferences = {
        // Set Google params based on user preferences
        'ad_storage': consentData.cookieGroups.marketing ? 'granted' : 'denied',
        'analytics_storage': consentData.cookieGroups.statistics ? 'granted' : 'denied',
        'ad_user_data': consentData.cookieGroups.marketing ? 'granted' : 'denied',
        'ad_personalization': consentData.cookieGroups.marketing ? 'granted' : 'denied'
      };
      // Update google consent
      gtag('consent', 'update', consentPreferences);
      console.log(consentPreferences);
    } catch (e) {
      console.error('Error parsing PrivacyWire-Data:', e);
    }
  } else {
    console.warn('No PrivacyWire-Data found in localStorage');
  }
}
// Update consent at pageload
document.addEventListener('DOMContentLoaded', updateConsentFromPrivacyWire);

5. This is what the parameters control:

  • ad_storage: Controls whether ad-related cookies and identifiers are stored (e.g., for remarketing).
  • analytics_storage: Controls whether analytics-related cookies are stored (e.g., for Google Analytics tracking).
  • ad_user_data: Controls the collection and use of user data for advertising purposes.
  • ad_personalization: Controls the use of data to personalize ads based on user behavior and preferences.

4. Configure the function name (here updateConsentFromPrivacyWire) in PrivacyWire module settings.

  • Like 1
  • Thanks 2
Link to comment
Share on other sites

  • 4 weeks later...

Hey @joshua  Thanks for this wonderful module!

I think I found some kind of bug, IDK. I am using ProcessWire 3.0.229 and PHP 8.1. Your module Privacy Wire is the latest version: 1.1.6

The Brave browser doesn't want to show the banner at all. I've attached a screenshot.

Deleted cache and cookies and tested in Chrome, Firefox, Edge, and Opera. I have no idea where to look for the "problem" in the code.

display.png

Link to comment
Share on other sites

  On 6/15/2024 at 6:36 AM, Leftfield said:

Hi @All,

Please, and I've tried really hard to find this but I can't: How can I implement this module with the default ProcessWire cookie? I need Reject All Cookies option.

Expand  

I don't know if it's possible to omit the default wire and wires cookies. But I think you don't need to as they could be declared as strictly necessary first-party cookies.

  • Like 1
Link to comment
Share on other sites

  On 6/20/2024 at 11:39 AM, Leftfield said:

@Kholjamate, try to explain to my customer who knows GDPR better than any lawyer, online audits and all AI tools.

Expand  

In this case, i would deactivate the session cookie completely. Here is an example for a solution, that keep it for logged-in users, but don't set it for guests:

https://processwire.com/talk/topic/15270-session-storage-and-lifetime/?do=findComment&comment=136575

 

  • Like 1
Link to comment
Share on other sites

  On 6/19/2024 at 10:04 AM, Leftfield said:

Hey @joshua  Thanks for this wonderful module!

I think I found some kind of bug, IDK. I am using ProcessWire 3.0.229 and PHP 8.1. Your module Privacy Wire is the latest version: 1.1.6

The Brave browser doesn't want to show the banner at all. I've attached a screenshot.

Deleted cache and cookies and tested in Chrome, Firefox, Edge, and Opera. I have no idea where to look for the "problem" in the code.

display.png

Expand  

Have you tried to deactivate Brave's internal privacy shield? Maybe Brave thinks it's an Ad-Popup.

  • Thanks 1
Link to comment
Share on other sites

  On 6/20/2024 at 12:51 PM, Leftfield said:

Yep, that was it. THANKS!!!!!!! Now I need to figure out how to go around it. Thanks once again. 

Expand  

Brave uses filterlists to detect ads. There are a lot of "privacy" and "wire" keywords. Maybe a workaround would be to change the PrivacyWire templates and use other class names.

Link to comment
Share on other sites

  On 6/20/2024 at 1:14 PM, Kholja said:

But in this case I would say it's what the user wants while he is using Brave?

Expand  

That's a good point, but it is literary intended for blocking ads. That's why I am using it: to check that my popups are working, etc. For the cookies, there is a setting in the browser (and this module has it in its settings) to send "Do not track."

For anyone with the same issue, I used custom classes and fixed an issue. Changed the name of classes which starts with privacywire and the word banner. 

@Kholja thanks again!

Edited by Leftfield
  • Like 1
Link to comment
Share on other sites

  • 2 months later...
  • 2 months later...
  On 6/6/2020 at 3:31 PM, Nick Belane said:

Hi Joshua, the module works fine.
I would like to use the Textformatter to generate a button. [[privacywire-choose-cookies]]
But I don't get how to implement the shortcode.. ?
In a Textfield? That doesnt work. Sorry for this noob-question.
Thank you!

Ok..now I got it!

Expand  

…I made an TextInputField (site_setup_cookiebox_toggler_text)

Then in the "Details" tab: Text Formatters > PrivacyWire Textformatter

I added this field to the home template. Then I pasted this [[privacywire-choose-cookies]] in the text field. The outputted the field content for the frontend:
$pages->get('/')->site_setup_cookiebox_toggler_text

It works but I wantet this in the template (without that workaround).

I tried this, but no luck:

$privacyWire = $modules->get('TextformatterPrivacyWire');
echo $privacyWire->render("[[privacywire-choose-cookies]]");

What was your solution?

Link to comment
Share on other sites

  • 2 months later...

Hi Processwire Community,

I´m struggling with Cumulative Layout Shift (CLS) problems in Google Core Web Vitals.
The PrivacyWire Banner causes Layout-Shifts on Page Load. I´ve tried to solve this by setting inline-styles for .privacywire class.
position: fixed; doesn´t solve the problem.

Do you have any suggestions to resolve this?

Thanks

Privacywire-CLS.png

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...