Tagged: , ,

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • May 31, 2015 at 4:43 pm #452256
    Mark_goessens

    Hi Kriesi,

    I’m using the plugin ‘Cookie Law info’ which has to be a sticky bar at the header.
    Because the header of the enfold template is a sticky bar too, there is a conflict.
    You can see it at this page: http://www.c-testing.nl/ccom/

    The cookie bar isn’t sticky anymore, and there appears a padding at the top of the theme header.

    How can I set these two to be sticky at the same time?

    Thanks in advance.

    Greets Mark

    June 1, 2015 at 9:19 am #452387
    Rikard

    Hey Mark_goessens!

    I’m not familiar with that plugin, would it be possible to set it to display at the bottom of the page instead?

    Cheers!
    Rikard

    June 1, 2015 at 12:13 pm #452487
    Mark_goessens

    Hi Rikard,

    It’s possible to place the sticky bar at the bottom of the page. But I prefer to place it at the top.
    Because at the bottom is will be placed over the content instead of beneath the content.
    But I was wondering if it was a template issue that a sticky bar at the top won’t act ‘sticky’ when there is allready another sticky header?

    Greets Mark

    June 1, 2015 at 1:51 pm #452512
    Yigit

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    div#cookie-law-info-bar {
  position: fixed;
}

    Regards,
    Yigit

    June 1, 2015 at 1:56 pm #452513
    Mark_goessens

    Hi Yigit,

    Thanks. I allready tried that. The sticky headers are both sticky now.
    But the cookie policy bar show up in front of the Enfold header.
    I could add margin-top to move the Enfold header down, but when the cookies are accepted, the enfold header has to be at the absolute top again.

    Greets Mark

    June 1, 2015 at 2:08 pm #452523
    Yigit

    Hi!

    Please try adding following code to Functions.php file in Appearance > Editor

    function add_custom_header(){
?>
<script>
jQuery(window).load(function(){
jQuery('a#cookie_action_close_header').click(function(){
jQuery('#header').addClass('agreed');
});
});
</script>
<?php
}
add_action('wp_footer', 'add_custom_header');

    and then add following code to Quick CSS 

    #header {
  top: 50px;
}
#header.agreed {
  top: 0!important;
}

    Best regards,
    Yigit

    June 1, 2015 at 2:17 pm #452532
    Mark_goessens

    Now the bars are looking good. But the cookie law header isn’t sticky anymore when I start scrolling.

    Can you see what happens?

    June 1, 2015 at 2:24 pm #452534
    Yigit

    Hey!

    Please keep this code in Quick CSS as well – https://kriesi.at/support/topic/sticky-cookie-law-bar/#post-452512

    Best regards,
    Yigit

    June 1, 2015 at 2:40 pm #452548
    Mark_goessens

    Of course! My fault. Thanks.
    This is working very good now!

    Greets Mark

    June 1, 2015 at 2:46 pm #452555
    Mark_goessens

    I’m sorry, I saw another thing that doesn’t work.

    When I click on ‘accepteer cookies’ (translate: ‘accept cookies’) the cookie bar disappears. And the header is at the absolutely top now.
    That’s good. But then when I refresh the page again, I see that the enfold header is not at the top anymore but any pixels lower.

    Can I change that somewhere?

    June 2, 2015 at 9:42 am #453016
    Ismael

    Hi!

    Try to use this code in the functions.php file:

    add_action('wp_footer', 'ava_custom_script', 10);
function ava_custom_script(){
?>
<script>
(function($){
  var cookie = $('a#cookie_action_close_header').length;
  if ( cookie ) {
    $('#header').css('top', '50px');
  }
}(jQuery));
</script>
<?php
}

    Cheers!
    Ismael

    June 2, 2015 at 10:00 am #453024
    Mark_goessens

    Hi Ismael,

    Do I have to delete the other code at functions.php Yigit gave me?
    I tried both options (with and without the code of Yigit). Both doesn’t solve the problem.

    This is the code in my functions.php:

    function add_custom_header(){
?>
<script>
jQuery(window).load(function(){
jQuery('a#cookie_action_close_header').click(function(){
jQuery('#header').addClass('agreed');
});
});
</script>
<?php
}
add_action('wp_footer', 'add_custom_header');

add_action('wp_footer', 'ava_custom_script', 10);
function ava_custom_script(){
?>
<script>
(function($){
  var cookie = $('a#cookie_action_close_header').length;
  if ( cookie ) {
    $('#header').css('top', '50px');
  }
}(jQuery));
</script>
<?php
}
    June 2, 2015 at 5:57 pm #453266
    Yigit

    Hey!

    You should remove my code and try the one Ismael posted. If that too does not help, please create a temporary admin login and post credentials here privately.

    Best regards,
    Yigit

    June 5, 2015 at 8:51 am #454993
    Mark_goessens
    This reply has been marked as private.
    June 6, 2015 at 8:51 am #455415
    Ismael

    Hi!

    Alright. Please check it now. Test it with or without the cookie: http://www.c-testing.nl/ccom/

    Wait for the page to finish loading.

    Best regards,
    Ismael

    June 8, 2015 at 8:50 am #455786
    Mark_goessens

    Hi Ismael,

    Now it works like I inspected! Thanks a lot for your help!

    Greets Mark

  • Author
    Posts
Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘Sticky Cookie Law bar’ is closed to new replies.