Consent Dialog not mobile friendly

Comments

7 comments

  • Avatar
    Martin Iv. – vConnect

    Hey Harry , 

    If you want you can use it to modify the table by displaying the data horizontally by using display:block on <td> , check this link:
    https://css-tricks.com/responsive-data-tables/

    Also you can see similar issue resolved in part of this topic:
    https://support.cookiebot.com/hc/en-us/community/posts/360009579494-change-the-formatting-of-copy-within-the-Cookie-Policies

    Regards, 
    Martin

    0
    Comment actions Permalink
  • Avatar
    Harry

    Hello Martin

     

    We do use the 'standard' dialog of the cookiebanner to prevent such changes.

    Who is able to make the change within the standard dialog?

     

    Kind regards

    Harry

    0
    Comment actions Permalink
  • Hi Harry,

    I understand you issue, but you can either switch to custom template and modify it as you need. The custom template itself does not mean that it will load completely different dialog, but it is the same as the standard one. In other words the starting point of modifying the custom template is actually the standard dialog, so you can modify just a bit and it will still look very much like the standard one.

    Another thing you can check is a plugin for Wordpress that one of cookiebot users Richard Vencu developed here: https://github.com/rvencu/Cookiebot-Responsive

    Regards,
    Martin

    -1
    Comment actions Permalink
  • Avatar
    Richard Vencu

    Yes. I just updated the plugin to version 1.2 to cope with latest changes in cookiebot html.

    -1
    Comment actions Permalink
  • Avatar
    Yanick Belart

    Hi there

    We have the same issue. We do NOT use wordpress. We would like to optimize the consent dialog (NOT the declaration) for mobile devices. E.g. remove the cookie image and get the text width 100%. In addition, we would like to remove a category checkbox because we don't have any cookie of a category. As a result, we will have more space on the small mobile screens.

    Is there an easy way to solve that or do we have to link a custom css file?

    Bests,
    Yanick

    1
    Comment actions Permalink
  • Avatar
    Richard Vencu

    Actually my solution rely on adding an attribute to the td containing the cookie information. At mobile the other table elements are hidden and the single td is displayed.

    In order to add this attribute (containing the column name) we need to use javascript. The plugin uses jQuery.

    The main problem is that we must monitor when the table appears in DOM (this event is later than DOM ready event) so we can run the javascript part. So the javascript needs to watch for the table to appear then apply the transformations.

    After that it is just a simple CSS thing to apply.

    If you can code, then you do not need the entire WordPress stuff but simply you need to load the 2 necessary files, one is javascript (depending on existence of jQuery) and the css files.

    These are the links to the files:

    https://github.com/rvencu/Cookiebot-Responsive/blob/master/cookiebot-responsive/public/js/cookiebot-responsive-public.js

    https://github.com/rvencu/Cookiebot-Responsive/blob/master/cookiebot-responsive/public/css/cookiebot-responsive-public.css

    You will need to delete parts of CSS and javascript in order to remove code that makes the declaration on the privacy policy page and leave only those that changes the dialog.

    0
    Comment actions Permalink
  • Avatar
    Richard Vencu

    if you will try these fixes please be aware that Cookiebot is updating its code sometimes. I will keep my plugin updated to fix whatever breaks. You also need to update the files manually if things do not work anymore as expected.

    Ideally Cookiebot will come up with a better solution for responsiveness, either by developing one or by merging my ideas into their code. At such time my plugin will become irelevant and should be removed.

    0
    Comment actions Permalink

Please sign in to leave a comment.