View Full Version : html calendar with previous months button

05-24-2012, 11:54 AM
I am trying to include the calendar below on my website which has hyperlinks for certain dates. Each month pdf newsletters are issued and I want to link them to the date they're issued on.

I have to code below but the problem is I don't know how to include for the previous months or the next month when the month hyperlink is clicked on at the bottom of the calendar.

I'd be very grateful for some help.

<div class="widget"><h3>Calendar</h3><div id="calendar_wrap"><table width="251" id="wp-calendar">
<caption>May 2012</caption>
<th width="33" title="Monday" scope="col"><div align="left">M</div></th>
<th width="28" title="Tuesday" scope="col"><div align="left">T</div></th>
<th width="34" title="Wednesday" scope="col"><div align="left">W</div></th>
<th width="38" title="Thursday" scope="col"><div align="left">T</div></th>
<th width="28" title="Friday" scope="col"><div align="left">F</div></th>
<th width="29" title="Saturday" scope="col"><div align="left">S</div></th>
<th width="29" title="Sunday" scope="col"><div align="left">S</div></th>

<td colspan="3" id="prev"><a href="http://www.mysite.com/2012/04"
title="View News Letters for April 2012">&laquo; Apr</a></td>
<td class="pad">&nbsp;</td>
<td colspan="3" id="next" class="pad">&nbsp;</td>

<td colspan="1" class="pad">&nbsp;</td>
<td> 1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
<td class="pad" colspan="3">&nbsp;</td>

05-24-2012, 12:11 PM
To do it entirely with HTML you'd create a separate page for each month and simply set the next and previous month links to link to the appropriate page.

05-24-2012, 12:45 PM
Thanks for the reply. I need to keep the webpage static and just for the calendar to be interactive. I assume it's possible but I haven't got a clue as I'm not a developer. The website is for a startup school although the sites up and running am just trying to upgrade it...
I looked at javascript solutions but could not find anything that covers what I need.

If anyone would be kind enough to help me out would appreciate it.

05-24-2012, 07:01 PM
Here's a JS one which is pretty simple to install & set up (just customize to match your site). http://calendar.pikesys.com/ It has the ability to include photos, links, etc. in each day's field.