Happy New Year 2019 Widgets for Decorating your Blogger Blog

Another year is going to end and we all will start our regime of taking a resolution and fulfilling it in this New Year, well from past 3 years I am also taking a resolution of maintaining my body but only GOD know what sort of health I am maintaining. Many of my friends have different plans but in my view none of them has fulfilled anything. But still things are going on and it will go on. Well even you can post some nice new year resolution status update on Facebook to motivate your friends. Either you follow it or not, it might still help. But being a blogger I love to decorate my blog with different widgets and stuff that could greet my visitors.

In case you also want to decorate your blog, then I am posting 4 different widgets that will take care of everything. I am giving you awesome fireworks show, sweet balloons widget that says Happy New Year 2018, the countdown timer and the last thing would be the cursor for your site.

#1. Countdown Timer Widget for New Year

Add a nice countdown timer to your blog, this will show you how much time is left to New Year’s Eve and even show your readers a lovely message when its New Year. You can make changes to this countdown timer by editing the RED Code highlighted in below code. Please check the demo of the timer below.

New Year Countdown!
Days
: :

1. Open Blogger > Layout > Add Gadget.
2. Choose HTML/JavaScript Gadget.
3. Add below code into the box and enjoy the widget.

   <style>#TimerDiv{background: #f6f6f6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw6MIcEmJ-GTVOXt0lqySTsqy6PgT1mkh_uyf2ToOXH4_YCUMrR5qW6pSfsIEwQQLEVeqryz3w9IFVYjycS4JioI3x1-_uUlG4wAq6TTS2OnwPYQwb0mBWS0QpXTXLLZV5FWvWH9Xsuh9G/s1600/nea+year+2018+celebration+hackinguniversity.jpg)no-repeat;background-size:cover;border-radius:3px;font-family:georgia;font-size:40pt;font-style:italic;padding:150px 20px 150px;margin:20px auto;text-align:center;color:white;text-shadow:1px 1px #000}#clock-days{color:yellow;font-weight:700}#clock-hr{font-weight:bold}#clock-secs{color:yellow}</style><div id="TimerDiv">New Year Countdown!<br/><span id="clock-days"></span> <font face="Georgia"><em>Days</em></font><br /><span id="clock-hr"></span><span class="clock-sep"> : </span><span id="clock-mins"></span><span class="clock-sep"> : </span><span id="clock-secs"></span></div></a><script type="text/JavaScript">
   function startTimer(){var e=new Date("January 1, 2019 00:00:00");var n=e.getTime();var r=new Date;var i=r.getTime();var s=n-i;var o=s/864e5;var u=23-r.getHours();var a=59-r.getMinutes();var f=59-r.getSeconds();if(Math.floor(o)<=-1){document.getElementById("TimerDiv").innerHTML="It's New Year Time, Friends!<br/>Happy New Year 2018 from HackingUniversity"}else{document.getElementById("clock-days").innerHTML=Math.floor(o);document.getElementById("clock-hr").innerHTML=u;document.getElementById("clock-mins").innerHTML=a;document.getElementById("clock-secs").innerHTML=f}t=setTimeout("startTimer()",999)}startTimer()
   </script>

4. You can also insert this code directly in any of your post by going to the HTML Section of your post.
5. After that Save your Gadget or Post and Voila! you have the countdown timer ready.

#2. Fireworks Show Widget for New Year Blogger

Wanna add some nice fireworks, well the demo is working right on this page, you can already see it, well you can add this either in your whole blog by adding this to the main HTML section or any specific post. Choice is yours, so lets see how you can add fireworks show in your blog.

1. Open Blogger > Theme > Edit HTML.
2. Press Ctrl + F & search for </body> tag & add below code above it.

   <script type="text/javascript">//<![CDATA[
   function write_fire(e){var t,n,r;stars[e+"r"]=createDiv("|",12);boddie.appendChild(stars[e+"r"]);for(t=bits*e;t<bits+bits*e;t++){stars[t]=createDiv("*",13);boddie.appendChild(stars[t])}}function createDiv(e,t){var n=document.createElement("div");n.style.font=t+"px monospace";n.style.position="absolute";n.style.backgroundColor="transparent";n.appendChild(document.createTextNode(e));return n}function launch(e){colour[e]=Math.floor(Math.random()*colours.length);Xpos[e+"r"]=swide*.5;Ypos[e+"r"]=shigh-5;bangheight[e]=Math.round((.5+Math.random())*shigh*.4);dX[e+"r"]=(Math.random()-.5)*swide/bangheight[e];if(dX[e+"r"]>1.25)stars[e+"r"].firstChild.nodeValue="/";else if(dX[e+"r"]<-1.25)stars[e+"r"].firstChild.nodeValue="\\";else stars[e+"r"].firstChild.nodeValue="|";stars[e+"r"].style.color=colours[colour[e]]}function bang(e){var t,n,r=0;for(t=bits*e;t<bits+bits*e;t++){n=stars[t].style;n.left=Xpos[t]+"px";n.top=Ypos[t]+"px";if(decay[t])decay[t]--;else r++;if(decay[t]==15)n.fontSize="7px";else if(decay[t]==7)n.fontSize="2px";else if(decay[t]==1)n.visibility="hidden";Xpos[t]+=dX[t];Ypos[t]+=dY[t]+=1.25/intensity[e]}if(r!=bits)setTimeout("bang("+e+")",speed)}function stepthrough(e){var t,n,r;var i=Xpos[e+"r"];var s=Ypos[e+"r"];Xpos[e+"r"]+=dX[e+"r"];Ypos[e+"r"]-=4;if(Ypos[e+"r"]<bangheight[e]){n=Math.floor(Math.random()*3*colours.length);intensity[e]=5+Math.random()*4;for(t=e*bits;t<bits+bits*e;t++){Xpos[t]=Xpos[e+"r"];Ypos[t]=Ypos[e+"r"];dY[t]=(Math.random()-.5)*intensity[e];dX[t]=(Math.random()-.5)*(intensity[e]-Math.abs(dY[t]))*1.25;decay[t]=16+Math.floor(Math.random()*16);r=stars[t];if(n<colours.length)r.style.color=colours[t%2?colour[e]:n];else if(n<2*colours.length)r.style.color=colours[colour[e]];else r.style.color=colours[t%colours.length];r.style.fontSize="13px";r.style.visibility="visible"}bang(e);launch(e)}stars[e+"r"].style.left=i+"px";stars[e+"r"].style.top=s+"px"}function set_width(){var e=999999;var t=999999;if(document.documentElement&&document.documentElement.clientWidth){if(document.documentElement.clientWidth>0)e=document.documentElement.clientWidth;if(document.documentElement.clientHeight>0)t=document.documentElement.clientHeight}if(typeof self.innerWidth!="undefined"&&self.innerWidth){if(self.innerWidth>0&&self.innerWidth<e)e=self.innerWidth;if(self.innerHeight>0&&self.innerHeight<t)t=self.innerHeight}if(document.body.clientWidth){if(document.body.clientWidth>0&&document.body.clientWidth<e)e=document.body.clientWidth;if(document.body.clientHeight>0&&document.body.clientHeight<t)t=document.body.clientHeight}if(e==999999||t==999999){e=800;t=600}swide=e;shigh=t}var bits=80;var speed=33;var bangs=5;var colours=new Array("#03f","#f03","#0e0","#93f","#0cf","#f93","#f0c");var bangheight=new Array;var intensity=new Array;var colour=new Array;var Xpos=new Array;var Ypos=new Array;var dX=new Array;var dY=new Array;var stars=new Array;var decay=new Array;var swide=800;var shigh=600;var boddie;window.onload=function(){if(document.getElementById){var e;boddie=document.createElement("div");boddie.style.position="fixed";boddie.style.top="0px";boddie.style.left="0px";boddie.style.overflow="visible";boddie.style.width="1px";boddie.style.height="1px";boddie.style.backgroundColor="transparent";document.body.appendChild(boddie);set_width();for(e=0;e<bangs;e++){write_fire(e);launch(e);setInterval("stepthrough("+e+")",speed)}}};window.onresize=set_width//]]></script>

3. After you have added the code, just press Save Template option & your are done.

#3. Simple Balloons Widget for New Year for Blogger Blogs

If you want to go really simple and easy on your blog, then simple Balloons widget would work for you, just check the below example on how its going to look like, the balloons are going to move as you scroll, it looks simple and neat.

1. Open Blogger > Theme > Edit HTML or Blogger > Layout > Add Gadget.
2. If you want to paste this code directly in the HTML of your blog, then press Ctrl + F & search for </body> tag and paste the code right above it or if you choose second option, then choose HTML/JavaScript gadget and then paste the code inside it and save.

   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN20UXLJTk6bJQADwp5oh6_YNeMuoBtuKDqq7HEaT5J4drBCrhexXLu53RDN3pN_7UUv_mWun-np68-3f6Q4Qsak4SepcAwvJdcd9Jmk7nBScF1iNrYSvMx4v8wmQseqqI53Fd1fcUdJFN/s1600/happy+new+year+balloons+widget+for+blogger.png" style="position:fixed; bottom: 0px;left:0px;border:none;z-index:5;"/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWorC1t9_tii2jzrbllRhMb90nH-RavTSYUTYMIiqjNxA4wmI6xalNV3RGIvbh0hA1M3rICXwNIY9-OmilKSnPAV5p_ubUMgcZf2rcDDxDlW7kfMAeRtLAR4ROjn4z_1W43pRe5Yede-RN/s1600/happy+new+year+balloons+widget+for+blogger+right.png" style="position:fixed; bottom: 0px;right:0px;border:none;z-index:5;"/>

3. After you have pasted the code, press Save Template option and refresh your blog to see this new widget getting loaded automatically.

#4. Happy New Year Balloons Cursor for Blogger Blogs

As you have seen I have changed my cursor to Santa Clause in my Christmas Widgets post, similarly I have changed my cursor to the Balloons in this New Year Widgets post. Apart from balloons there are many other cursors you can choose from.

1. Open Blogger > Theme > Edit HTML.
2. Press Ctrl + F & search for <body> tag & paste below code below this tag.

   <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/holidays/hol-5/hol407.cur), progress !important;}</style>

3. After you have pasted this up, just press the Save Template option and enjoy.

You can choose many more cursors from there new year cursors page, after you have selected the one cursor you would like to use, simple copy the HTML of that and repeat the above process.

---

So guys this ends our another post on New Year Widgets, I hope you enjoyed this article. Do comment and share this article with all your friends, so that even they can use these widgets on there blogs.