Como usar o novo snippet multilíngue com detecção automática de idioma

Estamos introduzindo um novo snippet com detecção automática de idioma para simplificar a incorporação em seu site. Esse recurso aprimorado da nossa Privacy Controls and Cookie Solution detecta automaticamente o idioma do usuário, reduzindo a necessidade de adicionar snippets de código separados para cada idioma. Veja a seguir um guia completo para ajudar você a entender e implementar essa nova funcionalidade.

Incorporação do novo snippet

Veja a seguir a sintaxe básica para o novo snippet com detecção automática de idioma:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csLangConfiguration = {
  "en": {
    "cookiePolicyId": 12345 // Cookie policy ID for English
  },
  "it": {
    "cookiePolicyId": 23456 // Cookie policy ID for Italian
  },
};
_iub.csConfiguration = {
  "siteId": 09876, // Your site ID
"cookiePolicyId": 12345, // Cookie policy ID of the main language for fallback
"storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Como funciona

• Configuração específica do idioma: O objeto csLangConfiguration define os IDs da política de cookies para cada idioma.
• Mecanismo de fallback: O cookiePolicyId no csConfiguration funciona como um fallback caso nenhum idioma seja detectado.
• Armazenamento: O uso do useSiteId no objeto storage permite que o consentimento do usuário seja válido em diferentes idiomas do seu site.

Utilização do snippet sem configuração remota

Quando a configuração remota está desativada, o snippet depende inteiramente dos parâmetros fornecidos no objeto _iub.csConfiguration. A sintaxe é semelhante à versão com configuração remota, mas especifica explicitamente todas as configurações, incluindo configurações de banner , opções de idioma, armazenamento e comportamentos de consentimento dentro do script.

Ajustes e personalização

O novo snippet permite que você personalize o banner de consentimento para cada idioma usando o objeto csLangConfiguration. Isso significa que você pode personalizar a aparência e o comportamento do banner de acordo com o idioma do usuário. Vamos explorar algumas personalizações comuns.

Exemplo 1: Alteração da aparência do banner por idioma

Suponha que você queira que o banner de consentimento tenha uma cor diferente para cada idioma, dando ao seu site uma aparência personalizada e específica para cada idioma. Neste exemplo, o banner fica vermelho para usuários que visualizam o site em italiano:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csLangConfiguration = {
  "en": {
    "cookiePolicyId": 12345
  },
  "it": {
    "cookiePolicyId": 23456,
    "banner": {
      "backgroundColor": "#FF0000"
    }
  },
};
_iub.csConfiguration = {
  "siteId": 09876,
  "cookiePolicyId": 12345,
  "storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Exemplo 2: Alternativas de consentimento específicas do idioma

Alguns países, como a Dinamarca, exigem que opções específicas de consentimento sejam visíveis aos usuários. Você pode configurar essas opções para serem exibidas somente quando o idioma do usuário corresponder a um requisito específico:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csLangConfiguration = {
  "da": {
    "cookiePolicyId": 7896,
    "banner": {
      "showPurposesToggles": true
    }
  },
};
_iub.csConfiguration = {
  "siteId": 09876,
  "cookiePolicyId": 12345,
  "storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Observação

Por padrão, o novo snippet usa armazenamento por site (useSiteId: true), o que significa que o consentimento do usuário será reconhecido nos diferentes idiomas do seu site. Isso é extremamente útil para sites com presença global, pois evita que os usuários precisem fornecer consentimento sempre que mudarem de idioma.

No entanto, você também pode ajustar esse comportamento no Configurador em Configurações Avançadas:

Como recriar o snippet por idioma (método legado)

Se você preferir, ainda é possível usar o método anterior, que usa snippets individuais para cada idioma (como na configuração legada). Essa abordagem pode ser útil se você quiser ter controle total sobre a configuração de cada idioma ou se a estrutura do seu site exigir snippets individuais. Veja como você pode criar snippets individuais para cada idioma:

1. Crie um snippet separado para cada idioma ativo usando apenas o objeto _iub.csConfiguration.
2. Adicione o idioma no parâmetro "lang" para cada snippet.
3. Inclua o cookiePolicyId específico do idioma em cada objeto _iub.csConfiguration.
4. Mantenha o script vinculado ao arquivo iubenda_cs.js para cada snippet.

Exemplos de snippets para diferentes idiomas

Veja como estruturar os snippets para inglês (en) e italiano (it):

Inglês:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
  "cookiePolicyId": 12345, // Fallback cookie policy ID
"siteId": 09876, // Site ID
"lang": "en",
  "storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Italiano

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"cookiePolicyId": 23456, // Fallback cookie policy ID
"siteId": 09876, // Site ID
"lang": "it",
  "storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Utilização do modelo GTM

No Google Tag Manager (GTM), adicionamos uma nova seção para definir configurações específicas do idioma. Esse recurso opcional permite que você gerencie diferentes configurações diretamente pelo GTM. Para mais detalhes, consulte o guia sobre como configurar o modelo GTM da iubenda para sites multilíngues