Post Updated: Now this tutorial includes an additional snow-storm script. This hack will display falling snow in your blog even though it does not include any images in the script.Whether it's winter, spring or your birthday, adding some falling snowflakes/flowers/leaves or balloons to your blog makes it attractive. And to do that, you simply have to paste a code snippet in any of your blogs HTML/JavaScript widgets.
To show this widget only in the Homepage or any other specific page, read this post:
How to show widgets only in specific pages.
Steps To Follow:
Log in to Blogger, go to Layout, click on Add a Gadget and select it as HTML/JavaScript. And add any of the two code snippets:

<script language="JavaScript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_snowflakes.js">
</script>
And to display falling leaves, use this code:

<script language="JavaScript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_leaves.js">NOTE: To change the images, first download the .js files, open it with text pad, and then in the code change the images with your own images.
</script>
UPDATE: Thanks to Schillmania, we now have an additional script to add falling snowflakes which looks very similar to actual snowfall.
Have a look at the live demo of this script. [Another Demo]
Code to add:
<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js" />You can further customize these snowflakes (color, number and twinkle effect) by adding these additional lines of code to it. So to add a customized widget, add this code instead of the previous one:
<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js" />
<!-- now, we'll customize the snowStorm object -->
<script type="text/javascript">
snowStorm.snowColor = '#99ccff'; // blue-ish snow!?
snowStorm.flakesMaxActive = 96; // show more snow on screen at once
snowStorm.useTwinkleEffect = true; // let the snow flicker in and out of view
</script>
The SnowStorm script is provided under a BSD license.



























95 comments:
hello..my snowflakes is not active..why??can u tell me..
well it's quite easy, and there's nothing to go wrong in it, you can try it on any other blog if you want to see the effect !
:))
great dude...
Thanks Vinay !
it not work also at my blog.
There is no problem in the code, the images were hosted at Gigaimage.com (code in red), and the servers at gigaimgae were down,
now they are alright, you can try it now !
If you are still getting any problem, then replace the red line in the code, with any other image's direct link !
Its not working in any of my blog.
I tried this script even with changing the image url and on 4 different blogs. But not working :(
Doesn't work for me either..
Ya even I found some problem in the code :-/ , and it's not working even with other javascript codes, I'll try to change this code ASAP....
Well I have changes the codes, so it works in Firefox and Opera but not in IE, so you may try it temporarily till I find something better !
PS: Do read the Notes in the above post !
great post thanks mate.......god bless you
welcome shilpa !
how to make ballon flakes? or party 'staff flaskes?
Nice tutorial...thanks for this !
:X nice....
very funny, move right, they go left XD thanks! By The way, DO you know anything about Flash?
It makes bloglittle slow:(
i'll review this post with embed/add chrismas games for my blogger from indonesia
@Anup
I think the first 2 don't make the blog slow, but the third one makes it a little slow, anyways Merry Xmas and Happy new year !
@Beben
I'm glad you found the post worth republishing. Thanks for spreading the word :)
thank you very much :X
You are most welcome :)
Thanks. I would like to download the jsfiles as indicated, but unable to, in order to change the image to falling feathers.
The blue snow is great!
Yeah that blue snow is really cool.
To download that file, right click and save this link (save target as/save link as):
Download Link
I do all of the steps above and they work.. thanks much... :X
Hello!
Thanks a lot for the great script!
I would like to let fall flowers on my blog and I read to download the .js-file and to change the image.
But now my question (yes, I know, I don't know a lot....): If I change the image, where do I have to save it and where do I have to save the new .js-file (the changed one)?
Thanks alot for your help
Annette ;-)))
Hi Annette,
I just checked your blog and found the falling flowers in your blog. The coding is all correct & so I hope you now know how and what to edit, to make any changes in the future? :)
what about the balloons? my blog has turned one year old, and i would like to celebrate. ha! thanks so much.
I love flower very much.many kind of flower in the world.
thanks so much.
thank you so much for such a lovely offering.
Thank you so much!
ooo it worked for me thank you I now have snow !!
Love it and it worked fine on my blogger site, under Safari. Now if I could only figure out how to make the flakes bigger!
Thanks so much!
http://papasuecreative.blogspot.com
THANK-YOU! I've been looking forever for a legit snow effect code that doesn't lag, scroll my site left and right, and looks nice!
You've helped me find the perfect code here! Thanks once again!
Thank you! This will be great for christmas!
I'm sharing this on my blog! Its great :)
Glad you like it buddy :)
& thanks for spreading the word :)
I can't get the snow to fall over the entire blog. It will only fall in the sidebar. I even tried to put it in the gadget under the header but it won't work there. Please tell me what I need to do to make the snow fall all over my blog
thank you
Jan
That's quite strange Jan. Anyway, instead of pasting the code in an HTML/JavaScript widget, paste it directly in to your template.
Go to Design-> Edit HTML
and find this code:
</body>
And paste the code immediately ABOVE it.
Very good !!! Thanks...
Thanks a bunch!!! Now my site looks more cooler!!!
-Serafin10 www.Serafin10TCPC.Blogspot.com 8-}
Works great on my blog!
D :)
Thank you so much! :) It was really easy and I like that the flakes are big, everything else I had found had too small flakes! :)
xxx
its so nice! thanks :)
Thank you very much... I used it on my blog and it looks great :-)
http://www.allindiadownloadz.blogspot.com
thax buddy, nice job, merry x'mas
http://sanhindapamula82.blogspot.com
hey friend thanks i used in my blog plz take alook www.jobsbywork.blogspot.com
Thank you for the easy-to-follow tutorial and snowfall script! I'm enjoying watching the pretty Christmas flurries on my blog, since we're not getting any in real life. :)
I'd like to have falling balloons or cupcakes on an upcoming birthday post, but this time I'm not clear on how to do it. I've found a couple of images I'd like to use and have them saved on my desktop and in PhotoBucket, but don't have the first clue where I go or what I do to "download the .js files"? (I guess my question is similar to Annette's, but since she obviously figured it out on her own you didn't need to answer her question here. So please do tell, how did she do it?) :-)
If you can just provide a script for falling balloons like you did for snow and leaves, that would be great too. Thank you, and Merry Christmas!
Hey there,
Merry Christmas and a Happy New Year :)
Here's the file you have to download:
http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_snowflakes.js
(Open it in your browser and save it as a .js file -> to edit it, open it with a notepad/textpad just as you open a text file).
Then in the second line of the code, you have to change this url:
http://4.bp.blogspot.com/_4fVBL4fjrFI/SZW47MeQrsI/AAAAAAAACOY/gI-apzr2W0c/s1600/SnowFlake.gif
with the DIRECT LINK of the balloon/cup cake image.
DIRECT LINK usually ends with file extension, like .jpg/.gif or .png
Once you edit it, then upload it to www.mdn.fm (you wil have to register here) and copy the DIRECT LINK of this .js file (now the link will end in .js) and then in the first code, instead of this link:
http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_snowflakes.js
Use the DIRECT LINK to your new .js file from mdn.fm
Thank you...
Sai - I'm not sure if I'll be able to figure all that out and get it to work in time (if ever, lol), but I really appreciate your taking the time to explain it all to me! I'll do my best to follow your instructions and maybe I'll surprise myself and end up with falling cupcakes! :-) Happy New Year!
@Arnavut
You're most Welcome :)
@Laloofah
Well, do try it and if you aren't able to...then just send me that image of the cupcake/balloon and I'll send you the code to use in your template :)
Hi Please can you help? i would love to change my snow effect on my blog now, would be cool to have flowers or cupcakes have you a code for them? pretty please?????
Thank you, Sai! I've been trying, but keep getting stuck. (A lot of it's just me and my low-tech tendancies, and some of it is that I'm on a new iMac that replaced my 9-year old Flower Power imac recently, and I'm still learning all its bells and whistles!)
I'm happy to provide you with the balloon and cupcake images and ever-so-grateful if you'd provide the code to make them fall! :-) I have them saved on my desktop, but am unsure how to get them from there to here (or from me to you without emailing them). If there's not a way to do that, I could provide the URLs for them from my PhotoBucket account, unless you have another suggestion. Let me know!
It looks like jules can use the falling cupcake code too. I do want to learn how to do this, but now's just not the time and I'd like this for a blog page I'm posting posting first thing Monday morning (if you can do this by then!)
Thanks again! And Happy New Year!
Well Laloofa, you can send the images either to my mail (see my contact page) or just comment here again with those photobucket links.
I will update the post, with the new code, which can be used by you ans Jules.
Thank you so much, Sai, I emailed them to you last night. :-)
Hi Laloof, I haven't received any mail regarding this. Plz mail it again to this id: bloggerstop.net [at] gmail [dot] com
Hi, Sai - I just re-sent it to your gmail addy. (I'd sent it to the admin/bloggerspot one before). Thanks for letting me know you hadn't gotten it!
Hi Im waiting with ecxitement!!!! for the new cupcakes or anything else but snow! lol!.I dont even know how to stop the snow effect yet? lol!
I need falling sunflowers...any ideas?
thx
patti
Open this link:
http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_leaves.js
and save it on to your desktop, as a .js (javascript) file. Open it with notepad/textpad and REPLACE this link:
http://1.bp.blogspot.com/_4fVBL4fjrFI/SZW5bHEV-lI/AAAAAAAACOg/LVmh3Ik1EAc/s1600/FallingLeaves.gif
with the DIRECT image address of a sunflower (use a small image of sunflower). SAVE the file.
Then upload the file to www.mdn.fm (you'll have to register there) and finally instead of the link in the tutorial above, use the one (DIRECT LINK) you'll get from www.mdn.fm
So, the code will look like this:
<script language="JavaScript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_leaves.js">
</script>
PS: If it's not clear to you, then just send me the sunflower image via the contact page of this blog. I'll send you the new code.
hi this is shankar i like sunflower
Thanks
i'll try it.
Hi, these are very beautiful script. But will u please create another two-three javascript files of raindrops & dew and baloon??
Please I'm eager to see it here.
Awesome Snow Flakes . Thanks :)
wow thanks
actually i made a post with this and added a site linking for u is it ok?
thanks
cool ... !!
Love your falling snow! So many have asked about it, too! Thank you for sharing. Come by and visit us sometime and see your snow at work on a Siberian Husky blog! :-)
Hunted all over for your twinkle effect. Didn't care forthe image snowflakes. Hugs to you!!!
Hi, Thank you. It works great. Is it possible to add two things:
z-layer adjustment
Speed adjustment.
Thanks it looks great on my site!
I love the falling snow that appears automatically on my Wordpress blog, http://daisybrain.wordpress.com/ . But I shall definitely look into adding a widget in the Fall for falling leaves!
love this. thanks for posting. my site looks festive.
I had no problem adding this script to my blogger site, thanks much!
YAY! it worked! love the snowstorm - thanks!
awesome
Thanx man, snow is great!
Thank you! it works fine on my blog! I love it! <3
It's on my blog now too~ Thank you so very much~~ :X
its really good, the best snowfall .
See this is my site ---
http://www.preciousgadgets.blogspot.com/
Thankyou!
it's work! thanx u so much!
Thanks!!!
well at last it worked for me thank you ... I am not a computer wiz but mangaed it after a while thank you for sharing ... I was expecting a storm but it is just a flurry at the moment ... lol ...
Can someone please tell me how I can make the snowflakes to only appear outside of website container? I do not want the snowflakes to cover up my website page. I only want them to appear on the left and right hand side of my website page.
I will check this thread to see if anyone can help me.
Thanks so much,
Tonya
@Sai
I sent you an email with the picture that I want to be my effect. Can you please create it for me?
can someone just post the script with flowers here so we can post some of them in our sites / blogs. Your kindness and generosity is much appreciated
Thank you so much!
its working...thank u..visit my blog...tit4tab.blogspot.in
how to make beautfull comment box , can we get his Exmple HTML code
=))
Allowed HTML tags: <b>, <i> and <a>
Join and share your views with other bloggers at BloggerStop Community
Comment Like This! and Optimize your blog...
SPAMMER OF THE MONTH: www[.]TopRankLinks[.]com