How can I change the [#DETAILS#]-value to show/hide after click?

Comments

2 comments

  • Hi Marvin,

    You could change toggle the [#DETAILS#]-value from "show details"/"hide details" from the button by using event listener. For that purpose you should use javascript to set the custom texts you'd like to use, wrap them in an event listener attached to CookiebotOnDialogInit. Below example shows how to change the text on the 'Show details' button on a multilevel type dialog.  

    <script type="text/javascript">

    window.addEventListener('CookiebotOnDialogInit', function (e) {
    CookiebotDialog.showDetailsText = 'Expand information';
    CookiebotDialog.hideDetailsText = 'Hide detailed information';
    }, false);

    </script>

    Of course, you could change the text content of showDetailsText and hideDetailsText to what your preferences are! 
    For more detailed information you could check out this article: https://support.cookiebot.com/hc/en-us/articles/360010631893-Custom-texts-on-buttons

    Regards,
    Spas

    0
    Comment actions Permalink
  • Avatar
    CookieMagic

    The above is not supporting multi-language (CookiebotDialog.hideDetailsText = 'Hide detailed information';) and will not (per definition) work with custom banners.

    A better method would be to get the translated values of"Text in [Show details] button" and "Text in [Hide details] button" from the CookiebotDialog object.

    Example in your case would be:

    document.getElementById("cookiebanner__showMoreBtn").addEventListener('click', event => {
    var moreContainer = document.getElementById("cookiebanner__more");
    var moreButton = document.getElementById("cookiebanner__showMoreBtn");

    if (moreContainer.style.display === "none") {
    moreContainer.style.display = "block";
    moreButton.innerHTML = CookiebotDialog.hideDetailsText;
    } else {
    moreContainer.style.display = "none";
    moreButton.innerHTML = CookiebotDialog.showDetailsText;
    }
    });

    You can check out our custom banner designs they might offer a good starting point for your needs.

     

    0
    Comment actions Permalink

Please sign in to leave a comment.