Add New Year 2015 Countdown widget in BlogSpot

how to add New Year 2015 Countdown widget in Blogger

new year 2015

Everybody is eagerly waiting for New Year 2015 celebration because this is very near to us. Recently many bloggers are trying to add New Year Widget. So I have designed a New Year countdown widget that is very attractive and it will add some extra spice on your blog. As well as you can show up and remind your blog readers about the New Year eve. I have designed this widget which will count till 1st January 2015. And after that it will show Happy New Year 2015 message. You can see the Widget Demo from Below.

However to add this widget in your Blog's sidebar it must be 300px width. Because less than 300px width the widget Text will break. But if your Blog's sidebar is more than 300px then it will be more beautiful.

Step 1 First Go to ->Blogger Dashboard -> Layout

Step 2 Now Click On Add a gadget link and add an HTMl/JavaScript widget


Step 3
 Now Copy the Code Given Below and Paste it to there.
 <link href="" rel="stylesheet" type="text/css" />
<style type="text/css">
a.BloggerSpice { text-decoration: none; display: block; outline: none; }
#NotonBochor { width:99%;background: #FEFEFE;background-image:url(;color: #000000;text-shadow: 0 0 3px #FB0825;font-family: 'Oswald', serif;font-size: 26px;text-align: center;line-height: normal; }
.NewYear-clock-sep { -moz-animation: sep-blinks 1.1s linear 0s infinite; -webkit-animation: sep-blinks 1.1s linear 0s infinite; animation: sep-blinks 1.1s linear 0s infinite;}
@-moz-keyframes sep-blinks 
0% {opacity:1}
50% {opacity:0}
100% {opacity:1} 
@-webkit-keyframes sep-blinks 
0% {opacity:1}
50% {opacity:0}
100% {opacity:1} 
@keyframes sep-blinks 
0% {opacity:1}
50% {opacity:0}
100% {opacity:1} 
<a target="_blank" class="BloggerSpice" href=''>
<div id="NotonBochor">
New Year Counting Till 2015<br/>
<img style="float:left;padding-left:10%;" src="" width="125px"/> 
</td></tr><span id="NewYear-clock-days"></span> Days To Go<br /><span id="NewYear-clock-hr"></span><span class="NewYear-clock-sep"> : </span><span id="NewYear-clock-mins"></span><span class="NewYear-clock-sep"> : </span><span id="NewYear-clock-secs"></span></div>
<script type="text/JavaScript">
function startTimer() {
    var newyr=new Date("January 1, 2015 00:00:00");
    var newyeartime=newyr.getTime();
    var todaytm=new Date();
    var todaytime=todaytm.getTime();
    var timeleft=newyeartime-todaytime;
    var leftdays = timeleft/86400000;
    var lefthr=23-todaytm.getHours();
    var leftmin=59-todaytm.getMinutes();
    var leftsec=59-todaytm.getSeconds();
    if (Math.floor(leftdays) <= -1) {
        document.getElementById('NotonBochor').innerHTML="It's New Years Eve!<br/>Happy New Year 2015";
    else {
        document.getElementById('NewYear-clock-days').innerHTML= Math.floor(leftdays);
        document.getElementById('NewYear-clock-hr').innerHTML= lefthr;
        document.getElementById('NewYear-clock-mins').innerHTML= leftmin;
        document.getElementById('NewYear-clock-secs').innerHTML= leftsec;
Step 4 Finally Hit the Save button. And check your Blog to see the widget.

I hope you and your blog visitors will love this beautiful widget. If you have any query regarding customization and installation then you can write us for better solution. 


The Final output will be like below image with animation. Thanks.
Add New Year 2015 Countdown widget in BlogSpot
4 Stars stars - "Add New Year 2015 Countdown widget in BlogSpot" Everybody is eagerly waiting for New Year 2015 celebration because this is very near to us. Re...

Post a Comment

thanks bro nice widget & advance happy new year 2015

Same to you bro..

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form


Email *

Message *