Articles Comments

Marco Luthe Online! » WordPress Stuff » Let It Snow On Your WordPress Blog

Let It Snow On Your WordPress Blog

It started snowing here in Hannover on Friday, 21st of November, and I decided to put a little snow script on my start page only (there are a lot of scripts out there – I tried several, and I decided to use this one).

Actually, it is pretty easy to install:

  1. Download the script and the image from http://www.altan.hr/snow/.
  2. Put them in the appropriate folders on your website server. Adjust the URI to your image (absolute paths!) within the javascript-file.
  3. You can change some other parameters, but you have to do that directly within the javascript file. For more details, visit the website of the script (see above).
  4. Open the “footer.php” of your WordPress theme (usually /wp-content/themes/[current_theme_name]/footer.php) and put the following code right at the end, but before the closing </body>-tag:
    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>[path to the .js-file relative to template folder]"></script>
  5. Done – have fun!

If you want the snow to appear on special pages only, use conditional tags to insert the script.

[Update from 2008-11-24]

I noticed that either the snow fades after the height of the window or it reappears on the top after it has gone a long way to the bottom of the page.

If you want a new flake to appear when one fades at the bottom, change the following within the javascript file:

  1. Set snowdistance = “windowheight”.
  2. Find the following code (should be line 71):
    dx[i] += stx[i];
  3. Insert after that the follwing code:
    current_pageYOffset = (ns6up && snowdistance=="windowheight") ? window.pageYOffset : (ie4up && snowdistance=="windowheight") ? document.documentElement.scrollTop : 0;
  4. Change
    document.getElementById("dot"+i).style.top=yp[i]+"px";

    to

    document.getElementById("dot"+i).style.top=current_pageYOffset+yp[i]+"px";
  5. Now, a new flake should appear on top when one fades at the bottom – no matter how far you have scrolled down.
  6. I also added a small link with a fixed div in the top right left corner of the window to stop the snow script (see the start page).

Filed under: WordPress Stuff · Tags: , , ,

blog comments powered by Disqus