CSSCalendar

How-to

Placing the calendar on the page is simple. First design a webpage in which you would like to place the calendar. Save this page as a "model" for all calendar pages. This page itself will not be altered but instead copied. (Each copy will then have a month-calendar added by CSSCalendar.)

With your new "model" page open, place your cursor where you want the calendar to go. Then go to the Insert menu, click on CSSCalendar, fill out the User Interface, click OK and as many months as you requested will each be placed on another copy of the "model" page, and saved in the "model" page's directory. That simple.

Editing each cell can be trying at times until you get the hang of it. See the FAQ. It often helps to edit the daily cells in Split mode so you can see where you are entering each item in the cell. Once you've got the knack of it, things go smoothly.

If you are going to have your client do the cell editing via Contribute, sometimes they'll need your help. At least mine does. But in general they get the hang of it pretty quickly too.

So, to reiterate,

Create and save a nice page on your site on which you wish to place a one-month calendar.
As with any other DW Object, place the cursor where you want the Calendar to go.
Click CSSCalendars on the Goodies tab of the Insert Bar (MX-DW8):

or
the Insert menu (DW4):

Using your "model" page as a guide, new page(s) will be created with nicely formatted, accurate calendar(s) inserted. The original page will not be altered at all, so you can use it again the next time you wish to generate more calendar pages. In just that one step, you may generate any number of month's pages, even across leap years. Tip: If the newly created files are not visible in your Site Window, then click the Site Refresh button atop that window, or simply press the F5 key.

As a realworld example of the above instructions:

Here is a "model" page I recently used for a site. Note the red X.
I placed the cursor at the red X in the "model" page, and inserted the CSSCalendar object.
And here is one of the resulting pages. Note the placeholders for, in this example, Title, Age, Time in each cell. You may edit those div names right in the CSSCalendar User Interface as you wish, like to Title, Time, Location. The "model" page was entirely unchanged and ready for use the next time I need to generate new calendars for the site.

Finally, here is the page rendered with each of the 3 supplied CSS files: one, two, three

When you upload your site to the server, you must remember to upload:
1) the folder "CSSCalendar" and its contents into the site root,
2) your newly created Calendar pages (but not the "model" page as it has no Calendar on it!)

The User Interface revealed :

There are numerous options available on the User Interface:

Some options need some explanation:

Link to CSS Style Sheet:: Several CSS style sheets are provided. Try each to see how they differ! These default css files are copied to your site into a CSSCalendar folder it creates. You may edit the files once they are in that folder, but be sure to select this "site" version the next time you create calendars or you'll overwrite your changes! A friendly warning pops up to remind you.
"To neighbor" link text:: Atop each calendar are links to prior and next months. You may change the default link text any way you wish - e.g. previous/next, or <</>> etc. You should go to the very first and last calendars in your series to remove the links to non-existent months!
Page URL's prefix:: The default document name will be e.g. 2003mar. and its extension will be whatever the extension of your starter page is. You may prepend text as needed, so perhaps : "cal_2003mar.asp."
Cell content:: The default cell (day) content contains divs for two events. The class names correspond to the CSS files. Placeholder "{"s are placed to make it easy to navigate the generated calendar for later editing. When you (or your Contribute user) are done editing, simply find/replace the "{"s with null to remove them from the page. This will leave the divs so you may still insert css-formatted text as needed later.
Neighboring month cells:: "blank" and "dates" will place your default cell content but without the placeholders, in the prior and next month cells of each calendar.
Save as (Clear) site defaults:: You may save (clear) your settings for this site to use in future, including any changes you've made to the default cell content.

Next, the FAQ which includes lots of Tips .....