HAPPY NEW YEAR SIDE WIDGET 2016 FOR YOUR BLOG

It will look like this

As 2016 is setting in the families are getting ready to celebrate the new year in some style. Some families will go for holidays and some will try to make the day special by celebrating it at home in some different way or going to some nearby park or any visiting place. But who says that we bloggers are old fashioned, we also have different widgets to make our blogs look ready for the New Year. In this post we are going to explain how to create a cool Blog Widget for New Year.

To create the widget you just need to follow the steps given :

1. First Log In into your blogger account.
2. Then select the blog you want to create the widget on.
3. Click on "Layout" tab.
4. Select "Add a Gadget" anywhere in the blog layout.
5. Select HTML/Java Script.
6. No need to give title to the gadget.
7. Add the following code :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><style type="text/css">/*<![CDATA[*/#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;left: -47px;width: 47px;background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3OLulXZlvFO4I4Mukz3g2PTSM2jbgUwCFYA1NNs4rAd3Pxo2qqZDMZ4t07ZC-3rzJBUqRXp5K_vCJLKtRTiIJqYVbhkjip85oPAS0d9mAuS1P-VbdOymeDeRjc_9gZFYETJxo1R9BIx8/s1600/new-year-popup-sidebar.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;}/*]]>*/</style><script type="text/javascript">/*<![CDATA[*/ (function(w2b){ w2b(document).ready(function(){ var $dur = "medium"; // Duration of Animation w2b("#fbplikebox").css({right: -250, "top" : 100 }) w2b("#fbplikebox").hover(function () { w2b(this).stop().animate({ right: 0 }, $dur); }, function () { w2b(this).stop().animate({ right: -250 }, $dur); }); w2b("#fbplikebox").show(); }); })(jQuery);/*]]>*/</script><div id="fbplikebox" style="display:none;"> <div class="fbplbadge"></div> <iframe src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ3MdcmwX6RiWnaEtOKGNsD5BVYyV65vmf-oLHAig2qDuYvz7cVeOsKMxKfLXOXlbCwTh_YpsLj0iwVxy3cNsEGNUbR7TQjXJvGK-PvJ4L-LJUJ94d9LjEs_ctai9kmkC3isItKBO3lvM/s1600/new-year-widget-blogger-popup.jpg" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;" allowtransparency="true"></iframe></div>

Watch the Live demo

Get a cool New Year corner widget here