You want to publish a list of upcoming events to a web site. Google Calendar provides a great way to manage that list of events. How do you get the data out of Google and into your web page?

Upcoming.js can lend a hand.

• Pull Google Calendar events into a web page
• Tiny (10K) and fast
• No external dependencies
• Intelligent defaults for ease-of-use
• Microformat-friendly default template
• Control the markup and appearance
• Works both standalone and as a jQuery plugin

1. Load Upcoming.js:

       <script type="text/javascript" src="js/upcoming-0.6.0.min.js"></script>
                                       

2. Add the container to your markup:

       <div id="upcomingjs"></div>
                                       

3. Initialize the events by passing in your calendar's public feed URL:

       <script type="text/javascript">
       upcomingjs.load("…");
       </script>
                                       

   Or with jQuery:

       <script type="text/javascript">
       $('#upcomingjs').upcoming("…");
       </script>
                                       

   Be sure to change the "basic" at the end of the feed URL to "full"; we need the extra info.