Tagged: ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • April 12, 2017 at 8:57 am #776539
    now2web

    Hi,

    thank you for creating this wonderfull Theme!

    I want to make the widget in my sidebar sticky but all I’ve tried doesn’t work…

    I’ve tried the Q2W3 Fixed Widget Plugin but it doesn’t word so well.

    When I’ve tried to fix the widget area with this CSS Code:

    .sidebar_left .sidebar{
  position:fixed;
}

    there comes an double right side border…

    Could you tell me how I can get the Widget area fixed without this error?

    Best Regards from Germany

    Robert

    April 12, 2017 at 12:30 pm #776606
    Guenni007

    well you can do this via:

    .inner_sidebar {
    position: fixed;
}

    but the footer is over that sidebar – so with small content there will be overlap –
    but what will you do in responsive case?
    what will you do with pages with big sliders or 1st color-section on top?
    What is the way for mobile devices? because often position fixed does not work on that case!

    even if we do that with jquery ( scroll to top than fixed) alot of questions stays unsolved

    April 12, 2017 at 9:59 pm #776931
    Guenni007

    if you are lucky with this here: https://webers-testseite.de/kokon/blog/
    i can tell you how to reach (even for only some pages – the other blog pages like : https://webers-testseite.de/kokon/blog/blog-multi-author/ do not do that trick !

    April 13, 2017 at 5:44 am #777014
    Rikard

    Hi @now2web,

    Did you have any luck with the suggestions @guenni007 posted?

    Best regards,
    Rikard

    April 13, 2017 at 8:16 am #777113
    Guenni007

    well this is the code for some pages on my testinstallation – you can get rid of that beginning if-clause 

    function my_fixed_sidebar() {
if( is_page(600) || is_page(1395)  || is_page(1398)  ) {
?>
<script type="text/javascript">
        jQuery(document).ready(function () {  
          var top = jQuery('.inner_sidebar').offset().top;
          var headerh = jQuery('header').outerHeight();
          jQuery(window).scroll(function (event) {
            var y = jQuery(this).scrollTop() + headerh;
                if (y >= top) {
                  jQuery('.inner_sidebar').addClass('fixed');
                  jQuery('.inner_sidebar').css('top', headerh );
                } else {
                  jQuery('.inner_sidebar').removeClass('fixed');
                  jQuery('.inner_sidebar').css('top', " " );
                }
                jQuery('.inner_sidebar').width( jQuery('.inner_sidebar').parent().width() - 50 );
            });
        });
</script>
<?php
}
}
add_action('wp_footer', 'my_fixed_sidebar', 20);

    without that if-clause on beginning:

    function my_fixed_sidebar() {
?>
<script type="text/javascript">
        jQuery(document).ready(function () {  
          var top = jQuery('.inner_sidebar').offset().top;
          var headerh = jQuery('header').outerHeight();
          jQuery(window).scroll(function (event) {
            var y = jQuery(this).scrollTop() + headerh;
                if (y >= top) {
                  jQuery('.inner_sidebar').addClass('fixed');
                  jQuery('.inner_sidebar').css('top', headerh );
                } else {
                  jQuery('.inner_sidebar').removeClass('fixed');
                  jQuery('.inner_sidebar').css('top', " " );
                }
                jQuery('.inner_sidebar').width( jQuery('.inner_sidebar').parent().width() - 50 );
            });
        });
</script>
<?php
}
add_action('wp_footer', 'my_fixed_sidebar', 20);

    than you have to setup in quick css :

    .fixed { position: fixed }

    BUT!

    on some pages with special Content on top and than colorsection under it with less content do not work as expected –
    but i think if sidebar is small enough and content is big enough it could work the whole site. Other wise – you see that the function can be setup through if clauses only to work for categories or posts or etc

    January 7, 2019 at 1:40 am #1050702
    Mululu94

    The Sidebar scroll behind the Footer Section. How can change this?

    Stop the Sidebar scrolling at the Footer Section??

    January 7, 2019 at 6:56 am #1050782
    Rikard

    Hi Mululu94,

    Please open a new thread and include admin login details in private so that we can have a closer look at your site.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Make Widgets Sticky with CSS’ is closed to new replies.