WebsiteBaker Community Forum

WebsiteBaker Support (2.13.x) => General Help & Support => Hilfe & Support (deutsch) => Topic started by: Siggit on May 29, 2023, 10:10:40 PM

Title: KLaro Consent Manager teilweise auf englisch
Post by: Siggit on May 29, 2023, 10:10:40 PM
Hallo,

ich nutze auf einer neuen Seite WB 2.13.3. r166, jetzt wollte ich Klaro Consent Manager verwenden und habe alles soweit eingebunden.

in der index.php des Templates steht im head:
Code: [Select]
<link href="<?php echo TEMPLATE_DIR?>/klaro/klaro.css" rel="stylesheet" type="text/css" />
vor dem schließenden body Tag steht:
Code: [Select]
<!--klaro-->
<script id="bodyjs" src="<?= TEMPLATE_DIR; ?>/js/body.js"></script>
<script defer  src="<?= WB_URL;?>/include/plugins/user/klaro/klaro-config.js"></script>
<script defer data-config="klaroConfig" src="<?= WB_URL;?>/include/plugins/user/klaro/klaro_v_0.7.1.8.js">
</script>
<!--Ende Klaro-->

Die Datein sind alles erreichbar.

Jetzt zum Problem, klaro gibt mir teilweise Text in englisch aus. "Hi! Could we please enable some additional services for technisch notwendig / Sicherheit, Sicherheit, Youtube Video & Styling? You can always change or withdraw your consent later."

Die Sprache der Seite ist auf Deutsch eingestellt, die Seite befindet sich derzeit in einem Unterordner hinter einer Wartungsseite als index.html im Verzeichnis Wartung läuft. Die Domai wird in dieses Verzeichnis gerootet (...\wartung\cms\ ist das WB Verzeichnis).

Habe Klaro identisch auf einer anderen Seite laufen, da kommt alles auf Deutsch. Finde den Fehler einfach nicht.

Hier mal der Code aus der Config

Code: [Select]
// By default, Klaro will load the config from  a global "klaroConfig" variable.
// You can change this by specifying the "data-config" attribute on your
// script take, e.g. like this:
// <script src="klaro.js" data-config="myConfigVariableName" />
// You can also disable auto-loading of the consent notice by adding
// data-no-auto-load=true to the script tag.
var klaroConfig = {
    // You can customize the ID of the DIV element that Klaro will create
    // when starting up. If undefined, Klaro will use 'klaro'.
    elementID: 'klaro',

    // How Klaro should store the user's preferences. It can be either 'cookie'
    // (the default) or 'localStorage'.
    storageMethod: 'cookie',

    // You can customize the name of the cookie that Klaro uses for storing
    // user consent decisions. If undefined, Klaro will use 'klaro'.
    cookieName: 'klaro',

    // You can also set a custom expiration time for the Klaro cookie.
    // By default, it will expire after 120 days.
    cookieExpiresAfterDays: 365,

    // You can change to cookie domain for the consent manager itself.
    // Use this if you want to get consent once for multiple matching domains.
    // If undefined, Klaro will use the current domain.
    //cookieDomain: '.github.com',

    // Put a link to your privacy policy here (relative or absolute).
    privacyPolicy: 'https://210.onkel-franky.de/de/sonstiges/datenschutz.php',

    // Defines the default state for applications (true=enabled by default).
    default: false,

    // If "mustConsent" is set to true, Klaro will directly display the consent
    // manager modal and not allow the user to close it before having actively
    // consented or declines the use of third-party apps.
    mustConsent: false,

    // Show "accept all" to accept all apps instead of "ok" that only accepts
    // required and "default: true" apps
    acceptAll: false,

    // replace "decline" with cookie manager modal
    hideDeclineAll: false,

    // You can define the UI language directly here. If undefined, Klaro will
    // use the value given in the global "lang" variable. If that does
    // not exist, it will use the value given in the "lang" attribute of your
    // HTML tag. If that also doesn't exist, it will use 'en'.
    //lang: 'en',

    // You can overwrite existing translations and add translations for your
    // app descriptions and purposes. See `src/translations/` for a full
    // list of translations that can be overwritten:
    // https://github.com/KIProtect/klaro/tree/master/src/translations

    // Example config that shows how to overwrite translations:
    // https://github.com/KIProtect/klaro/blob/master/src/configs/i18n.js
// Übersetungen der Hinweistexte
    translations: {
        // If you erase the "consentModal" translations, Klaro will use the
        // bundled translations.
        de: {
            consentModal: {
                description:
                    'Hier können Sie einsehen und anpassen, welche Information wir über Sie sammeln. Einträge die als "Beispiel" gekennzeichnet sind dienen lediglich zu Demonstrationszwecken und werden nicht wirklich verwendet.',
            },
            sessionCookie: {
                description: 'CMS Session Cookie. Wird bei Schließen des Browsers gelöscht',
            },
            klaro: {
                description: 'Anzeige und Verwaltung der gespeicherten Informationen',
            },
            mathCaptcha: {
                description: 'Captcha für die Absicherung des Kontaktformulares',
            },
inlineTracker: {
                description: 'Beispiel für ein Inline-Tracking Skript',
            },
            externalTracker: {
                description: 'Beispiel für ein externes Tracking Skript',
            },
            adsense: {
                description: 'Anzeigen von Werbeanzeigen (Beispiel)',
            },
youtube: {
                description: 'Berechtigung zum Abspielen von Youtube Videos',
            },
            // matomo: {
            //    description: 'Sammeln von Besucherstatistiken',
            //},
            camera: {
                description:
                    'Eine Überwachungskamera (nur ein Beispiel zu IMG-Tags)',
            },
            //cloudflare: {
            //    description: 'Schutz gegen DDoS-Angriffe',
            //},
            intercom: {
                description:
                    'Chat Widget & Sammeln von Besucherstatistiken (nur ein Beispiel)',
            },
            mouseflow: {
                description: 'Echtzeit-Benutzeranalyse (nur ein Beispiel)',
            },
            googleFonts: {
                description: 'Web-Schriftarten von Google gehostet',
            },
            purposes: {
                wbfunction: 'technisch notwendig / Sicherheit',
                analytics: 'Besucher-Statistiken',
                security: 'Sicherheit',
                livechat: 'Live Chat',
                advertising: 'Anzeigen von Werbung',
                styling: 'Styling',
youtube: 'Youtube-Video',
            },
        },
        en: {
            consentModal: {
                description:
                    'Here you can see and customize the information that we collect about you. Entries marked as "Example" are just for demonstration purposes and are not really used on this website.',
            },
            sessionCookie: {
                description: 'Needed session cookie. Is deleted when the browser is closed.',
            },
            klaro: {
                description: 'Manage consent on this website',
            },
            mathCaptcha: {
                description: 'Captcha to protect contact form',
            },
            inlineTracker: {
                description: 'Example of an inline tracking script',
            },
            externalTracker: {
                description: 'Example of an external tracking script',
            },
            adsense: {
                description: 'Displaying of advertisements (just an example)',
            },
youtube: {
                description: 'Permission to play YouTube Videos',
            },
            // matomo: {
            //    description: 'Collecting of visitor statistics',
            //},
            camera: {
                description:
                    'A surveillance camera (just an example for an IMG tag)',
            },
            //cloudflare: {
            //    description: 'Protection against DDoS attacks',
            //},
            intercom: {
                description:
                    'Chat widget & collecting of visitor statistics (just an example)',
            },
            mouseflow: {
                description: 'Real-Time user analytics (just an example)',
            },
            googleFonts: {
                description: 'Web fonts hosted by Google',
            },
            purposes: {
                wbfunction: 'technically necessary / Security',
                analytics: 'Analytics',
                security: 'Security',
                livechat: 'Livechat',
                advertising: 'Advertising',
                styling: 'Styling',
youtube: 'Youtube-Video',
            },
        },
    },

    // This is a list of third-party apps that Klaro will manage for you.
    // The apps will appear in the modal in the same order as defined here.
// Third PArty Cookies - Sessions, Captcha Cookie (Math)
    apps: [
        {
            name: 'sessionCookie',
            title: 'Session Cookie',
            purposes: ['wbfunction'],
            cookies: ['wb-xxxx-sid'],
            required: true,
        },
{
            name: 'klaro',
            title: 'Klaro Consent',
            purposes: ['security'],
            default: true,
//required: true,
        },
        {
            name: 'mathCaptcha',
            title: 'Math Captcha',
            purposes: ['security'],
default: true,
            //required: true,
        },
        //{
            // Each app should have a unique (and short) name.
            // name: 'matomo',

            // If "default" is set to true, the app will be enabled by default
            // Overwrites global "default" setting.
            // We recommend leaving this to "false" for apps that collect
            // personal information.
            // default: false,

            // The title of you app as listed in the consent modal.
            //title: 'Matomo/Piwik',

            // The purpose(s) of this app. Will be listed on the consent notice.
            // Do not forget to add translations for all purposes you list here.
            // purposes: ['analytics'],

            // A list of regex expressions or strings giving the names of
            // cookies set by this app. If the user withdraws consent for a
            // given app, Klaro will then automatically delete all matching
            // cookies.
            // cookies: [
                // you can also explicitly provide a path and a domain for
                // a given cookie. This is necessary if you have apps that
                // set cookies for a path that is not "/" or a domain that
                // is not the current domain. If you do not set these values
                // properly, the cookie can't be deleted by Klaro
                // (there is no way to access the path or domain of a cookie in JS)
                // [/^_pk_.*$/, '/', 'klaro.kiprotect.com'], //for the production version
                // [/^_pk_.*$/, '/', 'localhost'], //for the local version
                //'piwik_ignore',
            //],

            // An optional callback function that will be called each time
            // the consent state for the app changes (true=consented). Passes
            // the `app` config as the second parameter as well.
            // callback: function(consent, app) {
                // This is an example callback function.
               // console.log(
               //     'User consent for app ' + app.name + ': consent=' + consent
                //);
            // },

            // If "required" is set to true, Klaro will not allow this app to
            // be disabled by the user.
            // required: false,

            // If "optOut" is set to true, Klaro will load this app even before
            // the user gave explicit consent.
            // We recommend always leaving this "false".
            // optOut: false,

            // If "onlyOnce" is set to true, the app will only be executed
            // once regardless how often the user toggles it on and off.
            // onlyOnce: true,
        //},       
        // {
            // name: 'inlineTracker',
            // title: 'Inline Tracker',
            // purposes: ['analytics'],
            // cookies: ['inline-tracker'],
            // optOut: false,
        // },
        //{
        //    name: 'externalTracker',
        //    title: 'External Tracker',
        //    purposes: ['analytics', 'security'],
        //    cookies: ['external-tracker'],
        //},
        //{
        //    name: 'intercom',
        //    title: 'Intercom',
        //    default: true,
        //    purposes: ['livechat'],
        //},
        // {
            // name: 'mouseflow',
            // title: 'Mouseflow',
            // purposes: ['analytics'],
        // },
        //{
        //    name: 'adsense',
        //    title: 'Google AdSense',
        //    purposes: ['advertising'],
        //},
        // {
            // name: 'camera',
            // title: 'Surveillance Camera',
            // purposes: ['security'],
        // },
        {
            name: 'youtube',
            title: 'Youtube Video',
            purposes: ['Youtube-Video'],
default: true,
// required: true,
        },
{
            name: 'googleFonts',
            title: 'Google Fonts',
            purposes: ['styling'],
default: true,
//required: true,
        },
        // {
           // name: 'cloudflare',
           //title: 'Cloudflare',
           // purposes: ['security'],
           // required: true,
        //},
    ],
};

Danke!


Title: Re: KLaro Consent Manager teilweise auf englisch
Post by: sternchen8875 on May 30, 2023, 01:44:31 AM
man könnte die Anleitung lesen, macht aber kein Mensch...   :wink:

aus der klaro.config.js (siehe auskommentiertes     //lang: 'en', etwa Z.52 oder 53)
Quote
Sie können die UI-Sprache hier direkt definieren. Wenn sie nicht definiert ist, verwendet Klaro den in der globalen Variable "lang" angegebenen Wert. Wenn diese nicht existiert, wird der Wert verwendet, der im "lang"-Attribut Ihres HTML-Tags. Existiert auch dieses nicht, wird 'en' verwendet.

Die direkte Angabe der Sprache in der klaro.config.js eignet sich eher für einsprachige Seiten, da dieser definierte Wert nicht dynamisch ist.

Für ein CMS ist wohl der html-Tag am einfachsten, den sollte man unter HTML5 eh überall drin haben. Genau geht es um diese Zeile aus der index.php des jeweiligen Templates

Hier als Beispiel aus dem DefaultTemplate

Code: [Select]
<html lang="<?= $sPageLang; ?>">
in diesem Fall wäre auch noch das Auslesen der Sprache notwendig, ebenfalls aus der index.php des DefaultTemplates
Code: [Select]
$sPageLang = strtolower(isset($wb->page) || ($wb instanceof frontend) ? $wb->page['language'] : 'EN');
das EN wäre anzupassen an die Sprache der Startseite, also die Seite, die beim Aufruf der Domain ohne weitere Parameter erscheint

Hast du einen Sprachenmix (so verstehe ich deinen Post), tippe ich eher auf ein Cacheproblem. Diesen bitte mal mit STRG + F5 übergehen und die Seite neu laden. Das gilt dann auch, wenn du mit den lang-Einstellungen experimentieren möchtest - nach jeder Änderung in den JS-Dateien den Cache löschen.

P.S.: wer noch mehr Sprachen benötigt, hier einige der gebräuchlichsten aus der EU -> https://github.com/klaro-org/klaro-js/issues/113



Title: Re: KLaro Consent Manager teilweise auf englisch
Post by: sternchen8875 on May 30, 2023, 11:55:19 AM
ein neuer Tag...

Tip zu deiner Installation
- schaue, das du die Originaldateien (hier die im Ordner include/plugins/default/klaro) möglichst im Original beläßt. Diese Dateien werden bei einem WB-Upgrade wieder überschrieben und jede Anpassung dort wäre dann verloren.

Auch hier hilft ein Blick in das DefaultTemplate, deren Ordnerstruktur und die Einbindung von Klaro. Lege eine eigene klaro.config.js in deine(n) Template-Ordner und ändere dort ab, was angepasst werden muß.
Beachte: die beiden Dateien klaro.config.js im Ordner include/plugins/default/klaro und in templates/DefaultTemplate/js sind nicht idetisch. Letztere enthält eine auf Deutsch angepasste Version, während Erstere nur Standardwerte hat. Vergleiche bitte die Unterschiede gerade im Abschnitt translations.
Im Zweifel solltest du als Ausgangspunkt die JS-Datei aus dem DefaultTemplate verwenden, das macht es leichter
Title: Re: KLaro Consent Manager teilweise auf englisch
Post by: Siggit on June 02, 2023, 08:14:32 PM
Hallo,

danke für deine Antwort, es lag an der index.php des Templates dort wurde keine Sprache definiert.

Code: [Select]
<!DOCTYPE html>
<html lang="<?php echo strtolower(LANGUAGE); ?>">
<head>

Habe diese Zeile zwischen html und head eingefügt und schon hats geklappt. Dis Sprache für die Seiten wird ja im Backend festgelegt.

 (Y) :-)