This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Tagged: 

Is this possible with the sidebar?

  • Creator
    Topic
  • #20966
    damian
    Participant

    Hi,

    Is there any plugin or code that would enable me to make a sidebar ‘stick’ at some point during page scrolling, and then ‘unstick’ when the footer comes up?

    Here’s an example of this happening on a different site …
    http://www.kayture.com/

    I’d love to add this feature to my Swagger websites.

    Thanks,
    Damian

Viewing 2 replies - 1 through 2 (of 2 total)
  • Author
    Replies
  • #20975
    Jason Bobich
    Keymaster

    Hello Damian,

    I apologize, but there is no feature in the theme for this, and would be a pretty significant customization you’d need to make to the theme. Unfortunately, this is pretty far outside of the realm of support. If you google “sticky sidebar” you’ll find tons of ways you could theoretically do it, but it’s going to probably take basic child theme, HTML, CSS, and javascript skills to make something like that happen.

    #20976
    Jason Bobich
    Keymaster

    With that said, I’m going to copy this, which I posted previously in the Jump Start forum, that maybe you can take a stab at doing in Swagger. In theory, it should work the same.

    http://support.themeblvd.com/forums/topic/floating-sidebar/

    =========

    Hello,

    Bootstrap (a frontend framework contained in your theme) actually has something called “Affix” you can use here. Checkout the docs here:

    http://getbootstrap.com/javascript/#affix

    Hopefully this will get you started on this.

    In your child theme’s functions.php, you can wrap your sidebar in the HTML markup that Bootstrap docs cite, using a couple of our action hooks before and after sidebars:

    function my_affix_top() {
    	echo '<div data-spy="affix" data-offset-top="200" class="affix-sidebar">';
    }
    add_action( 'themeblvd_fixed_sidebar_before', 'my_affix_top', 11 );
    
    function my_affix_bottom() {
    	echo '</div><!-- .affix (end) -->';
    }
    add_action( 'themeblvd_fixed_sidebar_after', 'my_affix_bottom', 9 );

    And then in your CSS, style what happens when Bootstrap adds the “affix” class when scrolling down:

    .affix-sidebar.affix {
    	position: fixed;
    	top: 10px;
    	width: 310px;
    }
Viewing 2 replies - 1 through 2 (of 2 total)
  • The forum ‘Swagger Responsive WordPress Theme’ is closed to new topics and replies.