I’ve seen bloggers usually decorate their blogs for Christmas as the month of December arrives. The most popular Christmas effect you see on websites and blogs is the Snowfall effect, in which the snowflakes fall slowly and this whole effect floats over the blog.

Christmas Snowfall effect for Blogger

So, how cool will it be to add such effect to our Blogger blogs? This tutorial covers how to add falling snowflakes to a Blogger blog with no coding skills required.

Snowfall effect for Blogger

The effect is simple, but supports advanced customization settings that may help you to bring it to the next level. Below are some features our Snowfall effect will carry:

  • Easy to install, hardly takes 5 minutes to get it up and running on your blog
  • You may easily customize the snowflakes size, shape, speed, number, color, and appearance
  • You may easily remove the effect if you wish when Christmas ends, just by removing the lines of code you’ve added
  • You don’t need to host the script files separately, I’ve already done it for you


I want to keep it as simple as possible, but I’m also sharing some information on what resources are we going to use, and how to customize the effect. We will be using jQuery and Snowfall jQuery plugin to bring about the effect.

You need not to worry about anything, just follow the below given steps and you will see the falling snowflakes in action on your blog.

  1. Edit HTML of your Blogger template and look for </body> (the closing body tag). See this guide if you don’t know how to edit the template.
  2. Paste the following code just above </body>:
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://66682590faf3f4abfbd1a321fe3d713631ccec2b.googledrive.com/host/0B2MISW7jvFMINHR0emdKS3JOZHc"></script>
    $(document).snowfall({flakeCount : 100, maxSpeed : 10, flakeColor: "white", minSize: 1, maxSize: 5, round: true});
    Add the code to Blogger template
  3. Finally, save the changes.

Now take a look at your blog. It must be snowflakes floating all over it. If you’ve not implemented it yet, have a look at my demo.

That’s it. You now have the effect you were looking for. But still their are workaround if you want some customizations with it.

Advanced Customization guide

As I told you in the beginning, you can customize the effect to make it as you wish. You just have to add a few parameters in the highlighted line in above code.

Note that parameter name and value should be separated with a colon (:) and the value should have a comma (,) in the end. Below give are the supported parameters:

  • flakeCount: any positive integer value eg. 100
  • flakeColor: a color value under quotes eg. "white" or #ffffff
  • minSize, maxSize, minSpeed, and maxSpeed: any positive integer value
  • image: An image path within quotes, eg. "https://lh4.googleusercontent.com/-YzPN4ySd22U/VICW6YLikSI/AAAAAAAAKkE/lTqqzUI0oOU/s0/flake.png". It will make that image appear in place of snowflakes
  • round: Boolean value i.e. true or false. It makes the snowflakes appear rounded.
  • shadow: Boolean value i.e. true or false. It gives the snowflakes a drop-shadow.

Hope you enjoyed the post. Feel free to post your views, suggestions, and questions in comments, and consider sharing it with friends. Merry Christmas 🙂