The YUI library, which stands for Yahoo User Interface, is a group of multiple controls that simplify Web enhancements. In order to use one of these, you must download the specific control and install it using the Adobe Extension Manager. Start the process by downloading the YUI Calendar, which is a zipped file and then expanding it. As of November 2009, the file name was YUI_2.8.0r4.zip. This page also contains extensive tutorial information about using the Calendar that will be well worth your time to read.
Locate the Adobe Extension Manager CS4 in the Adobe program group. After opening this program, click on the “Install” button at the top. This opens a window to locate the YUI Calendar. The image in the next section shows the Extension Manager after installing and enabling the YUI calendar with a checkmark in the “Enabled” box.
You will also need to ensure you have the latest package of Spry controls. Visit the Adobe Dreamweaver support site and download this set of functions. The latest update by November 2009 was Spry_1_6_1_022400. Once downloaded and unzipped. Use the Extension Manager again to install these controls.
Add a Basic Calendar
Link to a Spry Data Set through the Wizard
In order to add dynamic functionality to the calendar, for example display information when a user clicks on a date, create a Spry Data Set, and link it to the Calendar. The Data Set can be in either HTML or XML. Select one type depending on the contents of your dataset, and then complete the Spry Data Set Wizard to convert from the original Data Set to the Spry version. In the original Calendar_Demo file, click “Insert,” “Spry,” and “Spry Data Set” This opens a window to “Specify Data Source.” Select the Data Type in the first box—either HTML or XML depending your source. The default Data Set Name is ds1; change this if you wish. If the data source uses tables, then set the “Detect” box to that method. If the data source used div commands, then change to that in the Detect box. Complete the steps in the Wizard by specifying the Data File using the “Browse” button in the next field.
Although creating the calendar is simple, the steps involved in building and linking a Data Set are not. You will save quite a bit of time by going through all the tutorials on the Yahoo UI site as well as additional Dreamweaver help information. There is even a video link to the Spry Data Set control on the opening page of Dreamweaver CS4.