HAPPY NEW YEAR 2016 POPUP WIDGET 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 :

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

<style type='text/css'>

#happynewyears2016FBpop {

position:fixed !important;

position:absolute;

top:-1000px;

left:50%;

margin:0px 0px 0px -182px;

width:300px;

height:auto;

padding:16px;

background:#FEFEFE;font:normal Dosis, Georgia, Serif;

color:#111;

border:2px solid #333;

-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

box-shadow:0px 1px 2px rgba(0,0,0,0.4);

-webkit-border-radius:10px;

-moz-border-radius:10px;

border-radius:10px;

}

#happynewyears2016FBpop a.bsclose {

position:absolute;

top:-10px;

right:-10px;

background:#fff;

font:bold 16px Arial, Sans-Serif;

text-decoration:none;

line-height:22px;

width:22px;

text-align:center;

color:#000000;

border:2px solid #333;

-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

box-shadow:0px 1px 2px rgba(0,0,0,0.4);

-webkit-border-radius:22px;

-moz-border-radius:22px;

border-radius:25px;

cursor:pointer;

}

</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type='text/javascript'>

$(window).bind("load", function() {

// Animate Top

$('#happynewyears2016FBpop').animate({top:"50px"}, 1000);

// Widget by www.happynewyears2016.com

$('a.bsclose').click(function() {

$(this).parent().fadeOut();

return false;

});

});

</script>

<div id='happynewyears2016FBpop'>



<center><b><a class="Happynewyears2016">Wishing You All A Very Happy New Year...</a></b><br/></center>

<center>

<a href="http://uniquedsoftware.blogspot.com/2016/01/happy-new-year-2016-popup-widget-for.html

" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="New Year 2016 Widgets" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ3MdcmwX6RiWnaEtOKGNsD5BVYyV65vmf-oLHAig2qDuYvz7cVeOsKMxKfLXOXlbCwTh_YpsLj0iwVxy3cNsEGNUbR7TQjXJvGK-PvJ4L-LJUJ94d9LjEs_ctai9kmkC3isItKBO3lvM/s1600/new-year-widget-blogger-popup.jpg" title="New Year 2016 Widgets" /></a></center>

<a class='bsclose' href='#'>×</a>

<center style="float:right; margin-right:10px;"><span style="font-size:xx-small; color:#000; text-decoration:none;">+Get this at</span> <a target='_blank' style="font-size:xx-small; color:#3B78CD; text-decoration:none;" href="http://uniquedsoftware.blogspot.com/2016/01/happy-new-year-2016-popup-widget-for.html
">Uniqued Software</a></center>

</div>