klaro-org / klaro-js

Klaro Privacy Manager. An open-source, privacy-friendly & compliant consent manager for your website.

Home Page:https://klaro.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

where to find text of cm-modal in klaro.js

jonsken opened this issue · comments

Where can I find and edit the text in klaro.js shown in the picture:
grafik

It is the content of the cm-header inside the cm-modal as code shown below:

<div class="cm-header">
    <button title="Close" class="hide" type="button">
        <svg role="img" aria-label="Close" width="12" height="12" version="1.1" xmlns="http://www.w3.org/2000/svg">
            <title>Close</title>
            <line x1="1" y1="11" x2="11" y2="1" stroke-width="1"></line>
            <line x1="1" y1="1" x2="11" y2="11" stroke-width="1"></line>
        </svg>
    </button>
    <h1 class="title"><span><u>test</u></span></h1>
    <p><span><span>Here you can see and customize the information that we collect about you.</span><span>
        </span><span>To learn more, please read our <a href="#" target="_blank">privacy policy</a>.</span></span></p>
</div>

It is mainly about:

test
Here you can see and customize the information that we collect about you.

For german e.g. it was possible by changing consentModal: { title: ""} (line 2747), but for english nothing happens (line 2872).

I used another key then title to override it. Maybe try this:

{
    consentModal: {
        description: "your new text"
    }
}

But im using german as the language but this shouldnt impact the config itself.

I checked it and the problem is that nothing of the text from consentModal{} is displayed:

consentModal: {
                description: "Here you can assess and customize the services that we'd like to use on this website. You're in charge! Enable or disable services as you see fit.",
                title: "Services we would like to use"
            },

Output:
grafik

Even in german only the title (and privacy policy) is displayed, but the description is not:

consentModal: {
                description: "Hier können Sie die Dienste, die wir auf dieser Webseite nutzen möchten, bewerten und anpassen. Sie haben das Sagen! Aktivieren oder deaktivieren Sie die Dienste, wie Sie es für richtig halten.",
                privacyPolicy: {
                    name: "Datenschutzerklärung",
                    text: "Um mehr zu erfahren, lesen Sie bitte unsere <a href='../legal/datenschutz.html#cookies' target='_blank'>Datenschutzerklärung</a>."
                },
                title: "Dienste, die wir nutzen möchten"
            },

Output:
grafik

I thought, that this is the part of code, which is responsible for generating the cm-header, but I do not see where it goes wrong:

var b = he("div", {
    className: "cm-modal cm-klaro"
}, he("div", {
    className: "cm-header"
}, e, he("h1", {
    className: "title"
}, he(Ee, {
    config: l,
    text: f(["consentModal", "title"])
})), he("p", null, he(Ee, {
    config: l,
    text: [f(["consentModal", "description"])].concat(m && [" "].concat(f(["privacyPolicy", "text"], {
        privacyPolicy: m
    })) || [])
}))),   .......

Hi @jonsken, sorry for the late reply, you can find the string in the translations section under en. Did you use the right key in the config? If you're not able to find it in the config you can also sign up for a free account and configure Klaro using the graphical IDE, you can export the config from there and use it in the self-hosted version.

We'll soon provide a version of the IDE that works without signing up for an account and which you can use to customize & test Klaro, this should make configuration much easier.

thanks @adewes !
is all in the config... I was just only looking throught the klaro.js...