Iubenda logo
Crie Agora

Documentação

Tabela de conteúdos

Cookie Solution para a Shopify: como exibir um banner de cookie e obter consentimento de cookie

Após inserir a Política de Privacidade em seu site da Shopify (que também inclui a política de cookies, caso você a tenha ativado), você pode complementar a configuração incorporando nossa Cookie Solution para [1] exibir um banner de cookie totalmente personalizável, [2] obter consentimento de cookies e [3] implementar o bloqueio prévio, conforme exigido pela Lei dos Cookies.

Na verdade, com exceção dos cookies isentos de consentimento, a Lei dos Cookies inclui não apenas a obrigação de criar e exibir ao usuário uma Política de Cookies, mas também de exibir um breve aviso (banner) na primeira visita do usuário e de bloquear scripts que instalem (ou pode instalar) cookies, até que o usuário forneça seu consentimento.

Neste manual, você aprenderá como integrar nossa Cookie Solution em sua loja Shopify. Uma vez que o método mostrado abaixo utiliza a Customer Privacy API (API de privacidade do cliente, na tradução livre) da Shopify (que bloqueia automaticamente cookies e rastreadores instalados tanto de forma direta pela Shopify quanto por qualquer plugin compatível), primeiro você deve ativar a opção Limit tracking to customers in Europe (Limite de rastreamento para clientes na Europa, na tradução livre) na sua Online Store > Preferences.

Shopify - Limite de rastreamento para clientes na Europa

Primeiro, acesse o Dashboard da iubenda e clique em [Seu site] > Política de Privacidade e de Cookies > Editar. Você notará uma caixa de Política de Cookies na coluna da direita.

Ativar Política de Cookies

Clique em Ativar política de cookies e Salvar alterações: sua Política de Cookies será gerada automaticamente com base na configuração de sua Política de Privacidade.

Se você já tiver sua própria Política de Cookies, poderá adicionar o link na Visualização Avançada do configurador da Cookie Solution. Selecione Personalizar em Política de Cookies e de Privacidade > URL da Política de Cookies. Mais informações no Manual avançado da Cookie Solution.

Clique em Gerar agora na opção Dashboard > [Seu site/aplicativo] > Cookie Solution.

Cookie Solution - Gere seu banner de cookie

Você será imediatamente direcionado para o painel de configuração do seu banner de cookie.

Cookie Solution - configurador de banner de cookie

Após a customização, Salve e Copie seu snippet da Cookie Solution.

Cookie Solution - Incorpore o banner do cookie

Você obterá um código semelhante a este:

<script type="text/javascript">
    var _iub = _iub || [];
    _iub.csConfiguration = {
        "countryDetection": true,
        "consentOnContinuedBrowsing": false,
        "perPurposeConsent": true,
        "lang": "en",
        "siteId": 11223344, //use your siteId
        "cookiePolicyId": 55667788, //use your 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>

Antes de colá-lo no tema da Shopify, você deve fazer alguns acréscimos (observe a _iub.csConfiguration.perPurposeConsent,_iub.csConfiguration.callback e as Linhas de rastreamento de API):

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

    <!-- code for Shopify (1 of 2) -->
    var onPreferenceFirstExpressedCallback = function(consent) {
        if (true == _iub.csConfiguration.perPurposeConsent) {
            consent.consent = Object.keys(consent.purposes).every(function(k) {
                return consent.purposes[k]
            });
        }
        window.Shopify.customerPrivacy.setTrackingConsent(consent.consent, function() {});
    }

    if (typeof _iub.csConfiguration.callback === 'object') {
        _iub.csConfiguration.callback.onPreferenceFirstExpressed = onPreferenceFirstExpressedCallback;
    } else {
        _iub.csConfiguration.callback = {
            onPreferenceFirstExpressed: onPreferenceFirstExpressedCallback
        };
    }
</script>

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

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

3. Adicione o snippet da Cookie Solution à sua loja da Shopify

Agora você tem duas opções:

Use um plugin

Use um plugin como este para adicionar o snippet da Cookie Solution (complemente com as duas partes de “código para Shopify”, consulte 2. Gere seu banner de cookies) ao <head> da sua loja da Shopify.

1. Acesse o painel de administração da sua loja Shopify e vá para Online Store > Themes. Chegando lá, clique em Actions à direita e, em seguida, em Edit Code.

Shopify - Edit code

2. Crie um novo snippet na pasta Snippets e nomeie-o como iub-cookie-banner.liquid

Shopify - Add a new snippet

3. Cole o snippet da Cookie Solution (complete com as duas partes de “código para Shopify”) no modelo iub-cookie-banner.liquid e salve-o.

Shopify - Cookie Solution snippet

4. Abra o layout theme.liquid (dentro da pasta Layout ) e adicione {% include 'iub-cookie-banner' %} entre {{ content_for_header }} e </head>.

Shopify - theme.liquid

5. Repita a etapa 4 para os layouts gift_card.liquid e password.liquid.

4. Configure o bloqueio de cookies para os outros scripts que você esteja usando

Poucas categorias de cookies são isentas da exigência de consentimento. Portanto, todos os scripts que foram adicionados às suas páginas e que instalam cookies devem ser bloqueados preventivamente, antes da obtenção do consentimento.

Para configurar o bloqueio prévio de cookies não instalados diretamente pelo Shopify (ou instalados por plugins que não usam a Customer Privacy API), consulte nosso guia sobre bloqueio por meio de marcação manual ou verifique outros métodos descritos em nossa introdução geral ao bloqueio prévio.

Gerencie o consentimento de cookie para sua loja Shopify

Gere um banner de cookie

Veja também