Gingitsune Productions
Visitors since 4/20/2010:


The Discovery Center of Ridgefield, CT is a nonprofit organization whose goal is to foster an appreciation of nature, science, history, and the arts. There previous website, wasn't user friendly. It was hard to navigate, once programs where on the site, they stayed on the site until they were taken off making it more of a hunt to locate current programs, information wasn't easy to locate, it had a ugly yellow background, and only one person on the board was capable of making changes to the site.

I have volunteered at the Discovery Center before, and often times enjoy helping out with the programs, but as a web programmer and surfer of the web, there site made me cringe. So I volunteered to redo the website to make it more dynamic, easier to update, and basically all around more professional looking.

After I got the go ahead, ftp access username and password, and the contact information for the hosting company I went about figuring out what I could use to make the new site. I was hoping to use ASP and an Access database, because this is what I was most familiar with, but the website currently was on a PHP server. To move it to a Microsoft server would cost extra money, but keeping it where it was and setting up a MySQL database would be free. Since the Discovery Center is nearly constantly in red when it comes to money, and they probably wouldn't have given me the go ahead if I didn't volunteer to do this for free, I told the hosting company to keep the website where it is and please add an MySQL database. The benefit of this is that the Discovery Center didn't have to pay extra and I got to play with a new programming language and server type. That is what you call a win win situation.

The first thing I did was make an administrator side of the site that you have to login to get to. This was for security purposes so that not just anyone could modify the website.

The following are what an Administrator can change as long as they have a sufficient permission level.

Basically the entire reason the site was built was to allow ease of adding, deleting, modifying programs and keeping track to online registrants.

A program needs to be flexible to allow for a number of different things. Here is a list of what the programs were coded to do...
  • can have an unlimited number of registrants or be limited to the number of seats available
  • can have a rain date and be moved to it without getting rid of the original date
  • can be marked as rescheduled
  • can be canceled without deleting from the system

Programs have a short description and an image that will go on the homepage. There is also a Description field that shows up only on the Public Side Program page. This field uses a rich text editor to allow even the html illiterate to insert pictures, text with pretty designs and formatting, tables, etc...

Registrants are associated with a single program. To help manage the registrants, there are several options available to the administrator...
  • View Registrants - views all registrants for a particular program.
  • Add/Edit Registrant - add or edit a registrant. An email will be sent out to the registrant to notify them.
  • Mass Mail - allows all registrants associated with a particular program to get the same message with a click of a button.
  • Printer Safe List - a new window will pop up with a printer safe version of all the registrants for a particular program so that an administrator can print it out to help with event check in
  • Export to Excel - exports all the registrants for a particular program to an excel document
  • Mail Registrant - emails a single registrant

See the screenshots for some of these pages bellow. Click on a thumbnail to enlarge.

Program List

Edit Program

Public Program Page

Program Registration Page
Program and Event Calendar
The Calendar gets dynamically generated. All programs that happen in a particular month appear on the calendar. If a program is rescheduled, moved to its rain date, or canceled it will be written in red. A canceled program also has an option to not appear on the calendar. The arrows on either side of the month name allow a user to jump forward one month or back one month. The drop down lists underneath the calendar will allow a user to jump to any month year combination. The calendar also has holidays on it. Holidays can be added or changed through the Administrator side by an administrator with sufficient permissions.

See the screenshots for some of these pages bellow. Click on a thumbnail to enlarge.

Holiday List

Edit Holiday

Program Calendar
The top of the homepage above the Program list is an editable region where the administrators of the Discovery Center can add anything they want. For instance if they want to promote a specific program, all they have to do is login to the administrator side of the site and make the changes in the Editor.

The homepage also has a list of current programs, up to 20. This list is dynamically generated using the programs database. Only the programs that are happening on the date or after the date a user views the site will show up here.

See the screenshots for some of these pages bellow. Click on a thumbnail to enlarge.

Edit Homepage

Homepage Public Side
Administrator Created Pages
An Administrator with sufficient permissions can create a database generated page. To create a new page they create a code that the page will use, name the page, then define the content with a rich text editor. This page then can appear on the site, provided there is a link to it.

See the screenshots for some of these pages bellow. Click on a thumbnail to enlarge.

User Pages Listed

Edit User Page
Left Navigation on Public Side
The left navigation uses css styles to change the background color. This is my first use of the css navigation. My previous navigation type involved extensive use of javascript to get the same effect and sometimes didn't work depending on the browser type and if javascript was turned on. The css style uses regular anchor tags, plus classes to duplicate the effect, but is more cross browser compatible and doesn't stop working if scripts is turned off.

The left navigation is dynamically generated by a database. To add, remove, edit, or change the placement of an item to the left navigation on all the pages of the site is to logon to the administrative side and make the changes.

See the screenshots for some of these pages bellow. Click on a thumbnail to enlarge.

Left Navigation List

Left Navigation Edit