How To Create Sticky Sidebar Widget 100% Genuine

How To Create Sticky Sidebar Widget 100% Genuine

Today We Share Another Blogger Tricks - "To Make Your Blogger Sidebar On Sticky ". Someone Find This Tricks to 'How to Make Sticky Sidebar Widget' So Here We Come With New Most Effective Tricks About Blogger.

How To Create Sticky Sidebar Widget

Sticky sidebar widget is important function in blogging. Both WordPress & Blog-spot.?

So you can use this sticky sidebar widget for blogger, to promote your most important posts, affiliate links, advertisement and get 100%  better results. We are seen many bloggers use sticky menu bar, but we recommended to used this sticky sidebar on yours blog.

Floating sidebar are also useful when you want to adding something in front of your visitors.

Now Learn Advantage Of Sticky Widget.??

Increases the click through rate (CRT)
Useful for increasing Ad-sense Revenue.
Use Sticky Email newsletter subscription widget for getting more subscribers.
Forces users to check your contents by Viewing the content on  part of the pages.

How to Create Sticky Sidebar Widget in Blogger ?

In this trick only for newbie bloggers who are faced with problem to create sticky-bar widget.

??Need Layout section.follow ??

Go to Blogger Dashboard > Template > HTML Editor.Search for </body> you can find this at the end of template.Then just paste below script just above or before </body>.

Next Paste the Given Below parsed Code On Above/Before On </body> Tag.

<!-- Sticky Sidebar Widget By Webduniya-->


&lt;b:if cond='data:blog.isMobileRequest == &amp;quot;false&amp;quot;'&gt;&lt;script type='text/javascript'&gt;//&lt;![CDATA[$(function() { if ($('#HTML1').length) { // Ganti "#sticky-sidebar" dengan ID tertentu var el = $('#HTML1'); var stickyTop = $('#HTML1').offset().top; var stickyHeight = $('#HTML1').height(); $(window).scroll(function() { var limit = $('#footer-wrapper').offset().top - stickyHeight - 20; // Jarak berhenti di "#footer-wrapper" var windowTop = $(window).scrollTop(); if (stickyTop &lt; windowTop) { el.css({ position: 'fixed', top: 65 // Jarak atau margin sticky dari atas }); } else { el.css('position', 'static'); } if (limit &lt; windowTop) { var diff = limit - windowTop; el.css({ top: diff }); } }); }});//]]&gt;&lt;/script&gt; &lt;/b:if&gt;
<!-- Sticky Sidebar Widget By Webduniya -->

Please Note*  Replace #HTML1 with your widget id.
If you want to show sticky widget in mobile then simply replace false with true on first line of script.

Finally : Need To Be Replace footer-wrapper with your footer wrapper id.

Add below script in css for widget setting.

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'> #HTML1{width:100%;max-width:300px;text-align:center;} </b:if>

Voila ; Click To Save And Check Your Blog. Ha Ha ???? 

If You Have Any Ideas, Article About Questions Then Feel Free To Comment Below We Will Reply Soon As Possible Your About  Query.Thank You For Reading Our Blog ????
Keep It Up.