Page 1 of 1

How to add the calendar to a page?

PostPosted: Fri Mar 28, 2008 12:19 am
by Jesse
Hello Chris,
Your script looks very nice. Maybe a stupid question: but how do I include the calendar on a page? I tried the .js files but it does'nt work.

Regards,
Jesse

Re: How to add the calendar to a page?

PostPosted: Fri Mar 28, 2008 1:54 am
by chris
HI there and welcome to the forum.

The js file is just for updating the calendar days availability state via ajax.
It is not used to render the calendar.

The calendar itself is entirely php based.

Have you checked the readme.txt file - I have tried to explain the process there.

New Install:
1. - Upload all files to your ftp
2. - Modify the includes/config.inc.php file with your db data and other values (paths, defaults etc.)
3. - Open "install/index.php" in your browser, this will create the availability table in your db
4. - navigate to "index.php" to see your calendar in action - click on dates to modify their state.
NOTE - you may also need to modify the "js/update_cal.js" slightly to set your image paths, type and size if you decide to use different ones than those provided


I have just realised that the current zip version was missing the css file. I have no re-zipped it with the css style sheet included.
Here is the contents of the css (incase you don't want to download it all again):
Code: Select all
table{
   font-size:100%;
   }
ul{
   text-align:left;
   }
h2{
   color:#336699;
   }
div#wrapper{
   background:#FFFFFF;
   width:600px;
   margin-left:auto;/* center it*/
   margin-right:auto;/* center it*/
   border: 1px solid #DDDDDD;
   text-align:center;
   padding:20px;
}

.side{
   text-align:right;
   padding-right:4px;
   background:#EEEEEE;
   border-right:6px solid #336699;
   width:140px;
   }
.data{
   border:1px solid #EEEEEE;   

   }
/******* END GENERAL LAYOUT STUFF ***********/




/*
CALENDAR
***********/

table .cal_month{
   border:1px solid #DDDDDD;
   background-color:#ffffcc;
   }
thead td{
   text-align:center;
}
.cal_title{
   border:1px solid #DDDDDD;
   background-color:#336699;
   text-align:center;
   color:#FFFFFF;
   }
.cal_data{
   text-align:center;
   }
.cal_empty{
   text-align:center;
   /*border:1px solid #EEEEEE;*/
   }


To include the calendar in your web, you will need to remove all the excess html code (<head>, <title> etc.) and strip it down to just the basic calendar.
Alternatively you could leave it as is and include it in your web as an iframe or even a pop-up window.

I am not sure exactly where you are getting stuck at with the install but I hope this helps point you in the right direction.

Chris

Re: How to add the calendar to a page?

PostPosted: Wed Aug 20, 2008 7:50 pm
by jmaxham
i am looking to add this page to my site as well.

i have installed it correctly, i want to use it on a reservations page where the user can see which dates are available and selects one. right now it looks like they can make several days appear as booked.