How To Install Stickies Widget In Blogger

The possibilities are many who know this tutorial and myriad strewn in a google search. But perhaps nothing wrong him when where I opt in to sharing this tutorial How To Install Stickies Widget In Blogger. Although many different ways but the way this one I think is very simple and easy. Let's jump start his tutorial.

How To Install Stickies Widget In Blogger

1. Please you guys just copy the code below and place it just above the code </body>

<script type='text/javascript'>
//<![CDATA[
$(function() {
  if ($('#sticky-sidebar').length) { // Ganti "#sticky-sidebar" dengan ID tertentu
    var el = $('#sticky-sidebar');
    var stickyTop = $('#sticky-sidebar').offset().top;
    var stickyHeight = $('#sticky-sidebar').height();
    $(window).scroll(function() {
      var limit = $('#footer-wrapper').offset().top - stickyHeight - 20; // Jarak berhenti di "#footer-wrapper"
      var windowTop = $(window).scrollTop();
      if (stickyTop < windowTop) {
        el.css({
          position: 'fixed',
          top: 20 // Jarak atau margin sticky dari atas
        });
      } else {
        el.css('position', 'static');
      }
      if (limit < windowTop) {
        var diff = limit - windowTop;
        el.css({
          top: diff
        });
      }
    });
  }
});
//]]>
</script>

Note the code marked, replace the code with the ID to be made sticky according to the template used.

#sticky-sidebar: ID of the content or widget to be made sticky
#footer-wrapper: Specify ID to limit sticky function

2. Next add the width to the content or widget that will be made sticky with CSS.
Suppose here I give 300px for sticky width.
Example :

#sticky-sidebar{width:100%;max-width:300px}

OR

#HTML1{width:100%;max-width:300px}

Specify the width according to the width of the sidebar of the template you are using. And also do not forget to replace the width on a particular query media.

Example :

@media only screen and (max-width:768px){
#sticky-sidebar{width:100%;max-width:100%}
}

Its true there are other ways to create sticky widgets but for me way over the most simple and easy. And for example you can see my blog with the look of your desktop. Sticky widget, I plug in the bottom of the sidebar that I make an ad. If I use.

Maybe that's all I can give on tutorial How To Install Stickies Widget In Blogger. When no reply yet understand please you can comment below. Good luck.

Share this post