So verwenden Sie das neue mehrsprachige Snippet mit automatischer Spracherkennung

Wir führen ein neues Snippet mit automatischer Spracherkennung ein, um die Einbettung auf Ihrer Website zu vereinfachen. Diese erweiterte Funktion in unserer Privacy Controls and Cookie Solution erkennt automatisch die Sprache des Nutzers, so dass Sie nicht mehr für jede Sprache einen eigenen Code-Snippet hinzufügen müssen. In dieser Anleitung erfahren Sie mehr über diese neue Funktion und lernen, wie sie sie implementieren können.

Bettet das neue Snippet ein.

Hier ist die grundlegende Syntax für das neue Snippet mit automatischer Spracherkennung:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csLangConfiguration = {
  "en": {
    "cookiePolicyId": 12345 // Cookie-Richtlinien-ID für Englisch
  },
  "it": {
    "cookiePolicyId": 23456 // Cookie-Richtlinien-ID für Italienisch
  },
};
_iub.csConfiguration = {
  "siteId": 09876, // Ihre Website-ID
"cookiePolicyId": 12345, // Cookie-Richtlinien-ID der Hauptsprache für Fallback
"storage": {
    "useSiteId": true,
  }
};</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

So funktioniert es

• Sprachenspezifische Konfiguration: Das csLangConfiguration-Objekt legt die Cookie-Richtlinien-IDs für jede Sprache fest.
• Fallback-Mechanismus: Die cookiePolicyId in der csConfiguration dient als Fallback, falls keine Sprache erkannt wird.
• Speicherung: Die Verwendung von useSiteId unter dem Speicherobjekt bedeutet, dass die Zustimmung des Benutzers für verschiedene Sprachen Ihrer Website gültig ist.

🌐 Den Mechanismus der Fallback-Sprache verstehen

Wenn das iubenda-Snippet keine Übereinstimmung zwischen der Sprache des Benutzers und der Sprache, die Sie in Ihrem _iub.csLangConfiguration-Objekt definiert haben, findet (z.B. wenn der Browser des Benutzers auf Chinesisch eingestellt ist, Sie aber kein Chinesisch konfiguriert haben), greift es automatisch auf eine Standardsprache zurück, die in Ihrem _iub.csLangConfiguration -Objekt konfiguriert ist.

👉 So funktioniert der Fallback:

Das System verwendet die erste Sprache, die in Ihrem _iub.csLangConfiguration-Objekt aufgeführt ist. Wenn Sie also möchten, dass eine bestimmte Sprache, z.B. Englisch (en-GB), immer dann angezeigt wird, wenn es keine Übereinstimmung gibt, stellen Sie einfach sicher, dass Englisch (en-GB) der erste Eintrag ist.

Beispiel:

Wenn Sie möchten, dass standardmäßig Englisch (en-GB) angezeigt wird:

_iub.csLangConfiguration = {

  "en-GB": {

    "cookiePolicyId":00000001 // Cookie policy ID for English UK

  },

  "fr": {

    "cookiePolicyId":00000002 // Cookie-Richtlinie ID für Französisch

  },

  "it": {

    "cookiePolicyId":00000003 // Cookie-Richtlinie ID für Italienisch

  }

  // ... andere Sprachen

};

Auf diese Weise entscheiden Sie, was die Benutzer sehen, wenn ihre Sprache nicht verfügbar ist.

Verwendung des Snippets ohne remote-Konfiguration

Wenn die Fernkonfiguration deaktiviert ist, verlässt sich das Snippet vollständig auf die im Objekt _iub.csConfiguration angegebenen Parameter. Die Syntax ist ähnlich wie bei der Version mit Remote-Konfiguration, jedoch werden alle Konfigurationen, einschließlich Bannereinstellungen, Sprachoptionen, Speicherung und Einwilligungsverhalten innerhalb des Skripts explizit angegeben.

Optimierungen und Anpassungen

Das neue Snippet ermöglicht es Ihnen, das Zustimmungsbanner für jede Sprache mithilfe des csLangConfiguration-Objekts anzupassen. Das bedeutet, dass Sie das Aussehen und das Verhalten des Banners je nach Sprache des Nutzers anpassen können. Sehen wir uns einige gängige Anpassungen an.

Beispiel 1: Ändern des Banneraussehens je nach Sprache

Angenommen, Sie möchten, dass das Einwilligungs-Banner für jede Sprache eine andere Farbe hat, um Ihrer Website ein individuelles und sprachspezifisches Aussehen zu verleihen. In diesem Beispiel färbt sich das Banner für Nutzer, die die Website auf Italienisch aufrufen, rot:

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

Beispiel 2: Sprachspezifische Schaltflächen zur Einwilligung

In einigen Ländern, wie z. B. Dänemark, müssen Nutzer bestimmte Einwilligungsoptionen sehen können. Sie können diese Optionen so konfigurieren, dass sie nur angezeigt werden, wenn die Sprache des Nutzers einer bestimmten Anforderung entspricht:

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

So bilden Sie das Snippet für jede Sprache nach (Legacy-Methode)

Wenn Sie es vorziehen, die vorhergehende Methode zu verwenden, bei der für jede Sprache ein eigenes Snippet verwendet wird (wie bei der vorhergehenden Einrichtung), können Sie dies weiterhin tun. Dieser Ansatz kann nützlich sein, wenn Sie die volle Kontrolle über die Konfiguration der einzelnen Sprachen haben möchten oder wenn Ihre Website-Struktur individuelle Snippets erfordert. So können Sie individuelle Snippets für jede Sprache erstellen:

1. Erstellen Sie für jede aktive Sprache ein eigenes Snippet, das nur das Objekt _iub.csConfiguration verwendet.
2. Fügen Sie die Sprache im Parameter "lang" für jedes Snippet hinzu.
3. Nehmen Sie die sprachspezifische cookiePolicyId in jedes _iub.csConfiguration-Objekt auf.
4. Behalten Sie für jedes Snippet das Skript bei, das auf die Datei iubenda_cs.js verweist.

Beispiel-Snippets für verschiedene Sprachen

Hier sehen Sie, wie Sie die Snippets sowohl für Englisch(en) als auch für Italienisch(it) strukturieren:

Englisch:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
  "cookiePolicyId": 12345, // Fallback Cookie-Richtlinie 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>

Italienisch

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"cookiePolicyId": 23456, // Fallback Cookie-Richtlinie 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>

Verwendung der GTM-Vorlage

Im Google Tag Manager (GTM) haben wir einen neuen Bereich für die Konfiguration von sprachspezifischen Einstellungen hinzugefügt. Diese optionale Funktion ermöglicht es Ihnen, verschiedene Konfigurationen direkt über GTM zu verwalten. Weitere Einzelheiten finden Sie in der Anleitung zur Einrichtung der GTM-Vorlage von iubenda für mehrsprachige Websites