Categories
WordPress

How to enable snowfall effect on WordPress Blogs?

If you have visited DailyTechTuts.com in past few days, then you might have noticed snow flakes falling all over this blog! Check out following video to see the snowfall effect in action:

Why this was done?:

  • This is the month of December and winter season can be experienced in almost all parts of the world. Some countries in the northern hemisphere also gets plenty of snowfall during this season.
  • December month is the month of major festivals like Christmas and New Year.
  • I got very much inspired by the falling snow effect on the official WordPress.com homepage and many of its sub-pages. Even many free users of WordPress.com reported sudden activation of snowfall effect on their blog.



How to enable snowfall in your WordPress Blog?

Blogs on WordPress.com

If you are blogging over a sub-domain of WordPress.com like http://www.abc.wordpress.com, then simply follow these steps in order to enable the effect:

  • Login to your WordPress Dashboard.
  • Navigate to Appearance >> Extras and Check the Box in front of Show falling snow on this blog.
  • Click on Update Extras button and it’s done.

You will see lots of snow on your site as soon as you visit your blog’s homepage/pages/posts.

Note: This option is not available throughout the year for WordPress.com users.

Self Hosted WordPress Blogs

If you are blogging over a self hosted installation of WordPress, then you can make use of certain plugins which are very easy to install and setup. These plugins actually puts a JavaScript at the top of your blog, because of which snowfall effect gets enabled. I am currently using following plugin for this blog:

Tribulant Snow Storm

Installation of this plugin is just like the installation of any other plugin of WordPress. All you need is to do is to upload the plugin’s compressed zip file in your blog’s plugin directory (/wp-content/plugins/) and activate it. You can also make use of WordPress’s inbuilt automatic plugin installer for installing the plugin.

Once the plugin has been successfully installed >> activate it and go to its settings under Settings (http://www.abcxyz.com/wp-admin/options-general.php?page=snow-storm). Once you are there you need to configure following things for the plugin:

  • Show on Posts/Pages: If you’d like to only show the effect on certain posts/pages of your blog, instead of your entire blog, then you need to search and select all those specific posts/pages to show falling snow on..
  • Snow Color: This field allows you to set the color of the falling snow flakes. By default its value is set to #FFFFFF.
  • Total amount of snow: This field allows you to limit the total amount of snow that is falling as well as sticking on your/visitor’s screen. The default value for this field is set at 128. however I will suggest you to go for a smaller value like 40 or even lesser than 40.
  • Falling Amount of Snow: This field allows you to limit the amount of onscreen snow that is falling at once. The default value for this field is set at 64, however I will suggest you to go for a smaller value like 20 or even lesser than 20. Also keep in mind that the value of this field must always be lesser than the immediate above field i.e. Total amount of snow.
  • Animation interval: This field allows you to set the animation interval for snowfall effect. If you set the value of this field as 25 then the animation will be fast and smooth but will cause high CPU usage, while value 50 is conservative and slower. I will highly suggest you to set 50 as the value of this field, else your site is going to slow down/hang your visitor’s (and maybe your’s too!) computer if they are using old hardware or outdated web browsers.
  • Mobile support: The plugin is capable of showing snowfall effect on mobile web browsers as well, but it’s suggested not to turn ON this feature because of to high CPU usage and battery drain in mobile devices.
  • Follow Mouse Cursor: If you’d like the onscreen snow to respond to/follow your/your visitor’s mouse cursor, then feel free to enable this option.
  • Snow stick: If you’d like the snow to stick at the bottom of the screen then enable this option.
  • Melt effect: Melt effect of snow is supported by certain web browsers. Feel free to enable this option if you’d like to see melt effect in action for all visitors.
  • Twinkle effect: Enable this option if you’d like to see twinkling effect for falling snow flakes.

Once everything above is set as per your requirements, click on Save Settings button and snow will start falling on your blog. The plugin will insert certain scripts at the top of your blog’s source code which may look something like following:

<script type=’text/javascript’ src=’https://cdn.dailytechtuts.com/wp-content/plugins/snow-storm/snow-storm.js?ver=672bc999e99a5a54a8d1ec0d3f169ad2′></script>

<script type=”text/javascript”>
jQuery(document).ready(function() {
if (typeof(snowStorm) !== ‘undefined’) {
snowStorm.flakesMax = 20;
snowStorm.flakesMaxActive = 10;
snowStorm.animationInterval = 50;
snowStorm.excludeMobile = true;
snowStorm.followMouse = false;
snowStorm.snowColor = ‘#FFFFFF’;
snowStorm.snowCharacter = ‘&bull;’;
snowStorm.snowStick = false;
snowStorm.useMeltEffect = false;
snowStorm.useTwinkleEffect = false;
snowStorm.zIndex = 999999;
}
});
</script>

Important notes:

  • If you are using a cache plugin like WP Super Cache, W3 Total Cache etc. with your installation, then you need to clear the cache after your install/uninstall above plugin.
  • If you have uninstalled the plugin and have also cleared the cache of static HTML pages of your site, and you are still you are seeing snow fall effect, then you need to clear the cache of your web browser or hit CTRL + F5.
  • If you are experiencing high CPU usage after installing above plugin or after enabling a particular option, then you should disable the plugin/that particular option.
  • If you have any query or concern then head over to support forum of above plugin.