Iubenda logo
Inizia la generazione

Documentazione

Indice dei contenuti

Cookie Solution per Shopify: come mostrare il cookie banner e raccogliere il consenso ai cookie

Una volta integrata la Privacy Policy sul tuo sito Shopify (informativa che, una volta attivata, include anche la Cookie Policy), puoi completare l’operazione incorporando la nostra Cookie Solution, così da [1] personalizzare e mostrare un cookie banner, [2] raccogliere il consenso all’uso dei cookie e [3] implementare il blocco preventivo dei cookie, come richiesto dalla Cookie Law.

Infatti, ad eccezione delle categorie di cookie esenti, la Cookie Law non solo ti obbliga a disporre di una Cookie Policy, ma ti chiede anche di mostrare un breve avviso (cookie banner) alla prima visita dell’utente, nonché di bloccare gli script che installano (o potrebbero installare) cookie prima di aver ottenuto il consenso dall’utente.

In questa guida ti mostreremo come integrare la nostra Cookie Solution nel tuo eCommerce Shopify. Dato che il metodo illustrato sfrutta le API Customer Privacy di Shopify (in grado di bloccare automaticamente i cookie e tracciatori installati direttamente da Shopify o da qualunque plugin le supporti), dovrai come prima cosa abilitare l’opzione Limita il monitoraggio dei clienti europei in Negozio online > Preferenze.

Shopify - Limita il monitoraggio dei clienti europei

Accedi alla dashboard iubenda e fai click su [Il tuo sito] > Privacy e Cookie Policy > Modifica. Noterai un box “Cookie Policy” nella colonna di destra.

iubenda - Attiva cookie policy

Facendo click su Attiva cookie policy si aprirà una finestra contenente alcune impostazioni consigliate. Una volta salvate le modifiche, la tua cookie policy verrà generata in automatico in base alla configurazione della tua privacy policy.

Se disponi già di una Cookie Policy conforme, puoi specificarne il link nelle opzioni avanzate del configuratore della Cookie Solution. Fai click su Custom sotto Cookie e Privacy Policy > URL della Cookie Policy. Maggiori dettagli nella guida avanzata alla Cookie Solution.

Fai click su Genera ora in Dashboard > [Il tuo sito] > Cookie Solution.

Cookie Solution - Genera il tuo cookie banner

Arriverai al pannello di configurazione del cookie banner.

Cookie Solution - Configuratore del cookie banner

Una volta conclusa la personalizzazione del cookie banner, Salva e Copia il codice risultante.

Cookie Solution - Codice di integrazione del cookie banner

Otterrai qualcosa di simile:

<script type="text/javascript">
    var _iub = _iub || [];
    _iub.csConfiguration = {
        "countryDetection": true,
        "consentOnContinuedBrowsing": false,
        "perPurposeConsent": true,
        "lang": "it",
        "siteId": 11223344, //usa il tuo siteId
        "cookiePolicyId": 55667788, //usa il tuo cookiePolicyId
        "floatingPreferencesButtonDisplay": "bottom-right",
        "banner": {
            "acceptButtonDisplay": true,
            "customizeButtonDisplay": true,
            "rejectButtonDisplay": true,
            "position": "float-top-center"
        }
    };
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Prima di incollarlo nel tuo tema Shopify, devi fare alcune aggiunte (nota le linee _iub.csConfiguration.perPurposeConsent, _iub.csConfiguration.callback e Tracking API):

<script type="text/javascript">
    var _iub = _iub || [];
    _iub.csConfiguration = {
        "countryDetection": true,
        "consentOnContinuedBrowsing": false,
        "perPurposeConsent": true,
        "lang": "it",
        "siteId": 11223344, //usa il tuo siteId
        "cookiePolicyId": 55667788, //usa il tuo cookiePolicyId
        "floatingPreferencesButtonDisplay": "bottom-right",
        "banner": {
            "acceptButtonDisplay": true,
            "customizeButtonDisplay": true,
            "rejectButtonDisplay": true,
            "position": "float-top-center"
        }
    };

    _iub.csConfiguration.perPurposeConsent = false;
    _iub.csConfiguration.callback = {
        onPreferenceFirstExpressed: function(consent) {
            window.Shopify.customerPrivacy.setTrackingConsent(consent.consent, function() {});
        }
    };
</script>

<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

<!-- Tracking API -->
<script type="text/javascript">
    window.Shopify.loadFeatures([{
            name: 'consent-tracking-api',
            version: '0.1',
        }, ],
        function(error) {
            if (error) {
                throw error;
            }
        });
</script>

3. Aggiungi lo snippet della Cookie Solution al tuo tema Shopify

Ora hai due alternative. Puoi:

Usa un plugin

Usa un plugin come questo per aggiungere il codice della Cookie Solution (completo delle linee _iub.csConfiguration.perPurposeConsent, _iub.csConfiguration.callback e Tracking API, vedi 2. Genera il tuo cookie banner) all’<head> del tuo negozio Shopify.

1. Accedi al pannello di amministrazione del tuo negozio e vai su Negozio online > Temi. Una volta lì, fai click su Azioni (a destra), poi Modifica codice.

Shopify - Modifica codice

2. Aggiungi un nuovo snippet nella cartella Snippets e chiamalo iub-cookie-banner.liquid

Shopify - Aggiungi un nuovo snippet

3. Incolla il codice della Cookie Solution (completo delle linee _iub.csConfiguration.perPurposeConsent, _iub.csConfiguration.callback e Tracking API) nel template iub-cookie-banner.liquid e salva.

Shopify - Cookie Solution snippet

4. Apri il layout theme.liquid (lo trovi nella cartella Layout) e aggiungi {% include 'iub-cookie-banner' %} tra {{ content_for_header }} e </head>.

Shopify - theme.liquid

5. Ripeti lo step #4 per i layout gift_card.liquid e password.liquid.

Sono poche le categorie di cookie che non richiedono il consenso. Di conseguenza, prima di installare cookie, devi bloccare i relativi script che hai aggiunto alle tue pagine, e rilasciarli solo quando l’utente ha prestato il proprio consenso.

Per implementare il blocco preventivo dei cookie non installati direttamente da Shopify (o installati da plugin che non usano le loro API Customer Privacy), dai un’occhiata alla guida al tagging manuale o agli altri metodi spiegati nella nostra introduzione al blocco preventivo dei cookie.

Gestisci il consenso ai cookie per il tuo negozio Shopify

Genera il tuo cookie banner

Leggi anche