Display an image according to the month name using javascript

Having content that changes dynamically (on it’s own according to some criteria) is a great way to add some extra interest and diversity to your site without the added time to maintain. Scripts can automatically change various aspects of your site without you doing a thing once the script is installed.This script will display an image depending on what month it is, and will automatically update the image as soon as the month changes.

To use:
Upload GIF images named each month, January.gif, February.gif, etc.

Change the following url in the code below to the location you uploaded all your images:

http://www.YOURDOMAIN.com/DIRECTORY-WITH-IMAGES/

Add the following code to the header of your page or site template for your site.
This code also works for Cafepress. Simply include this code either in your custom html layout header area OR, I have it in my “store description” area of my premium shop.

<!– START CODE –>
<script>

var d=new Date()

var month=new Array(12)
month[0]=”January”
month[1]=”February”
month[2]=”March”
month[3]=”April”
month[4]=”May”
month[5]=”June”
month[6]=”July”
month[7]=”August”
month[8]=”September”
month[9]=”October”
month[10]=”November”
month[11]=”December”

document.write(“<img src=http://www.YOURDOMAIN.com/DIRECTORY-WITH-IMAGES/” + month[d.getMonth()] + “.gif border=0>”)

</script>
<!– END CODE –>

Share the Insight!
If you enjoyed this article, please share the thoughts and subscribe to my free mailing list and receive updates in your inbox!

{ 1 comment… read it below or add one }

Darice June 10, 2010 at 9:04 am

Fun, thanks for sharing this! Now I can look organized and on top of things even if I’m not! ;-)

Reply

Leave a Comment

About me
Contact me
Privacy Policy and Disclosure