Como utilizar o novo snippet multilingue com deteção automática de idioma

Estamos a introduzir um novo snippet com deteção automática de idioma para simplificar a incorporação no seu website. Esta funcionalidade melhorada da nossa Privacy Controls and Cookie Solution deteta automaticamente o idioma do utilizador, reduzindo a necessidade de adicionar snippets de código separado para cada idioma. Eis um guia completo para o ajudar a compreender e implementar esta nova funcionalidade.

Incorporação do novo snippet

Eis a sintaxe básica para o novo snippet com deteçã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 para um idioma: O objeto csLangConfiguration define os ID da política de cookies para cada idioma.
• Mecanismo de fallback: O cookiePolicyId em csConfiguration serve como fallback no caso de não ser detetado qualquer idioma.
• Armazenamento: Utilizar useSiteId no âmbito do storage objeto significa que o consentimento do utilizador é válido nos diversos idiomas do seu website.

Utilizar o 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 definições de banner, opções de idioma, armazenamento e comportamentos de consentimento no script.

Ajustes e personalização

O novo snippet permite-lhe personalizar o banner de consentimento para cada idioma utilizando o objeto csLangConfiguration. Deste modo, pode personalizar o aspeto e o comportamento do banner em função do idioma do utilizador. Vamos explorar algumas personalizações comuns.

Exemplo 1: Alterar o aspeto do banner por idioma

Vamos supor que pretende que o banner de consentimento tenha uma cor diferente para cada idioma, dando ao seu site um aspeto personalizado e específico para cada idioma. Neste exemplo, o banner fica vermelho para os utilizadores que visitam 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: Botões de consentimento específicos para cada idioma

Alguns países, como a Dinamarca, exigem que opções de consentimento específicas sejam visíveis para os utilizadores. Pode configurar estas opções de modo a que apenas apareçam quando o idioma do utilizador corresponder a um determinado requisito:

<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>

Nota

Por predefinição, o novo snippet utiliza o armazenamento ao nível dos sites (useSiteId: true), o que significa que o consentimento do utilizador será reconhecido nos diferentes idiomas do seu website. Isto é particularmente útil para websites com uma presença global, uma vez que evita a necessidade de o utilizador prestar o seu consentimento sempre que muda de idioma.

No entanto, pode também ajustar este comportamento no Configurador, em Definições avançadas:

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

Se preferir utilizar o método anterior de utilização de snippets individuais para cada idioma (como na configuração antiga), pode continuar a fazê-lo. Esta abordagem pode ser útil se pretender ter controlo total sobre a configuração de cada idioma ou se a estrutura do seu website exigir snippets individuais. Eis como pode criar snippets individuais para cada idioma:

1. Crie um snippet separado para cada idioma ativo utilizando apenas o objeto _iub.csConfiguration.
2. Adicione o idioma no parâmetro "lang" para cada snippet.
3. Inclua o cookiePolicyId específico da língua em cada objeto _iub.csConfiguration.
4. Guarde o script que liga ao ficheiro iubenda_cs.js para cada snippet.

Exemplos de snippets para diferentes idiomas

Veja como estruturar os snippets tanto para inglês (en) como para 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>

Utilizar o modelo GTM

No Google Tag Manager (GTM), adicionámos uma nova secção para configurar definições específicas para um idioma. Esta funcionalidade opcional permite-lhe gerir diferentes configurações diretamente através do GTM. Para mais detalhes, consulte o guia sobre Como configurar o modelo do GTM da iubenda para sites multilingues