How to Make any Blogger Widgets Sticky

 When a visitor scrolls down your blog to view more content, the widget you set goes out the window from the top to make way for the lower portion that enters from the bottom.A normal Menu bar become invisible when a visitor scroll down your blog for more content and then Visitor have to scroll up for navigating to another menu.You might put a back to top button on your blog to back to top of your blog or you can make your menubar sticky on the top of your blog.Today i'am going to share script thats make your blogger widget sticky.

How to Install :

• Go to Blogger Dashboard → Template → Edit HTML .
• Find bellow code

</body>

• Now Paste Bellow Script above </body>.

<script>
//<![CDATA[
bs_makeSticky("Your_Widget_ID"); // enter your widget ID here
function bs_makeSticky(elem) {
    var bs_sticky = document.getElementById(elem);
    var scrollee = document.createElement("div");
    bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
    var width = bs_sticky.offsetWidth;
    var iniClass = bs_sticky.className + ' bs_sticky';
    window.addEventListener('scroll', bs_sticking, false);
    function bs_sticking() {
        var rect = scrollee.getBoundingClientRect();
        if (rect.top < 0) {
            bs_sticky.className = iniClass + ' bs_sticking';
            bs_sticky.style.width = width + "px";
        } else {
            bs_sticky.className = iniClass;
        }
    }
}
//]]>
</script>
<style>
.bs_sticking {background:#f2f2f2 !important; position:fixed !important; top:0; z-index:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3); margin-top: 0; position:relative\9 !important;}
</style>

• Now get the Widget ID or element which you want to make sticky.
• Replace "Your_Widget_ID" with your widget ID.

Ex:     Your widget Id is HTML99, then the code would be:

          bt_makeSticky("HTML99");

How to get Widget ID :

• Go to Blogger Dashboard → Layout .
• Click on Edit (any widget you want to make it sticky) (see bellow screenshot ).

• See Last in URL you get your widget id. (see bellow screenshot )

• Now Save Your Template.