Så använder du HubSpot med CookieTractor

Det populära CRM-verktyget HubSpot erbjuder många användbara funktioner för din webbsida. För att uppfylla lagkravet behöver du säkerställa att integrationen tar hänsyn till de val som besökaren gör.

När man använder en CMP som CookieTractor är det optimalt om valen som görs i dialogen kan användas tillsammans med HubSpots inbyggda cookie banner.

Så konfigurerar du HubSpot för hantering av cookies

Det finns flera sätt att integrera HubSpot på webbsidan, varav det vanligaste är att inkludera HubSpot scriptet i din HTML, enligt följande exempel:

<!-- Start of HubSpot Embed Code -->
<script type="text/javascript" id="hs-script-loader" async defer src="//js-eu1.hs-scripts.com/xxxxxxxx.js"></script>
<!-- End of HubSpot Embed Code -->

Det är också vanligt att använda ett CMS plugin, som det officiella HubSpot pluginet för WordPress, vilket genererar ett script liknande detta på webbsidan:

<script type="text/javascript" id="leadin-script-loader-js-js-extra">
/* <![CDATA[ */
var leadin_wordpress = {"userRole":"visitor","pageType":"archive","leadinPluginVersion":"11.1.75"};
/* ]]> */
</script>
<script type="text/javascript" src="https://js-eu1.hs-scripts.com/xxxxxxxx.js?integration=WordPress&amp;ver=11.1.75" id="leadin-script-loader-js-js"></script>

HubSpots inbäddade kod sätter cookies utan samtycke

Som standard sätter scriptet cookies så fort besökaren går in på websidan. För att säkerställa att webbsidan uppfyller lagkraven behöver man aktivera HubSpots inbyggda cookie banner.

Logga in på ditt HubSpot konto och navigera till inställningssektionen för Data Privacy & Consent

Klicka på kugghjulet
Klicka på Privacy & Consent i sidomenyn
Gå till fliken för Cookies

Här behöver du ställa in en cookie banner för din publika domän (och eventuellt även för testdomäner).

När du konfigurerar bannern är det viktigt att se till att Banner Type är inställd på Opt-in och att alternativet Allow opt-in by category är aktiverat.

När cookie bannern är publicerad kommer både CookieTractors dialog och HubSpots cookiebanner att visas på din webbsida.

I det här skedet kommer vissa cookies från HubSpots cookie banner fortfarande att sättas innan besökaren har gett sitt samtycke, exempelvis cookies som __cf_bm och _cfuvid. Dessa cookies tillhör infrastrukturen och sätts av Cloudflare (som används av HubSpot) och anses vara direkt nödvändiga. Därför kan de sättas utan att besökaren först ger sitt samtycke. Dessa cookies används inte av HubSpot för att spåra dina besökare på något sätt.

Nästa steg är att dölja HubSpots banner och använda JavaScript för att automatiskt justera HubSpots inställningar när besökaren interagerar med CookieTractors popup.

Lägg detta script precis före den avslutande body taggen i HTML koden för din webbsida.

<style>
/* Hide the Hubspot cookie banner */    
#hs-banner-parent {display:none;}
/* Hide any Hubspot chat until after consent has been given */
html.cc-active #hubspot-messages-iframe-container {display:none !important;}
</style>
<script>
    window.addEventListener('CookieConsent', function (event) {
                
        if(event.detail.trigger!=='initial')
            return;

        var hasMarketingConsent = event.detail.current.includes('marketing');
        var hasStatisticalConsent = event.detail.current.includes('statistical');
        var hasFunctionalConsent = hasMarketingConsent || hasStatisticalConsent;

        if(cookieTractor.consent.available.includes('functional')) {
            hasFunctionalConsent = event.detail.current.includes('functional');
        }
        
        var isAcceptAll = hasMarketingConsent && hasStatisticalConsent && hasFunctionalConsent;

        if(isAcceptAll) {
            document.querySelector('#hs-eu-confirmation-button').click();
            return;
        }

        // Open Hubspot cookie settings dialog
        document.querySelector('#hs-eu-cookie-settings-button').click();
        setTimeout(function(){

            if(hasFunctionalConsent){
                var elmFunctional = document.querySelector('#hs-category-toggle-functionality').click();                
            }

            if(hasStatisticalConsent){
                document.querySelector('#hs-category-toggle-analytics').click();
            }

            if(hasMarketingConsent){
                document.querySelector('#hs-category-toggle-advertisement').click();
            }

            setTimeout(function(){                
                document.querySelector('#hs-modal-save-settings').click();
            },50)
            
        },50);
                    
    });
</script>

Med scriptet på plats så kommer HubSpots cookies att sättas i enlighet med det samtycke som ges i CookieTractors cookie banner.