Next

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque nisl nibh, consectetur ac consequat sit amet, blandit vitae dolor. The next event from this numerology calendar is: Waiting for Google.... Ut tristique metus suscipit urna mattis at volutpat purus vehicula. Praesent auctor erat sed justo suscipit hendrerit.

The example above shows the insertion of a Google calendar event title in the middle of a paragraph.  Using gCalMarkup this only requires three lines of HTML.  Let's go through each one.  First is the actual HTML from the above paragraph (the background style has been left out for clarity):

1. ...is: <span id="{gCalMarkup _id}.main">Waiting for Google...</span>.  Ut tristique...

gCalMarkup needs to know where on the current page the Google Calendar™ events should be inserted.  It does this by looking for an HTML element with a unique id.  This element is called the main element and "id={gCalMarkup _id}.main" in the line above provides this unique id (see the reference manual for details on the purpose of {gCalMarkup _id} ).

In this case the main element is <span>, but most HTML elements can be used (we'll learn about a few restrictions later). The main element can contain anything initially, but usually something like "Waiting for Google..." is used to indicate that Google Calendar™ events have not been received yet. When gCalMarkup receives calendar data it will replace the contents of the main element with information from the events.  Later we'll learn how to create more than one main element. 

The following HTML element describes what information will be placed in the main element and how it should be formatted:

2. <span id="{gCalMarkup _id}.mainTemplate">{gCalMarkup _eventTitle}</span>

This element is called the mainTemplate and has an id of "{gCalMarkup _id}.mainTemplate".  Again, any HTML element can be used, but usually it will be the same as the main element.  In this case the contents of the mainTemplate element, "{gCalMarkup _eventTitle}", is a special gCalMarkup selector that refers to the title of the Google Calendar™ event. There are many other gCalMarkup selectors to extract event dates, descriptions, location, etc (see the reference manual).

The last required line tells gCalMarkup about the Google Calendar™ we want to use:

3. {gCalDefine calendar id="nc" key="6hmji7d389ho5eavfq817fgtmlcg7iur%40import.calendar.google.com" maxResults="1"}

The {gCalDefine calendar...} command defines a calendar. There are two required parameters: "id" and "key". The id parameter is a short alphanumeric name used to identify the calendar (this will be more useful later when we deal with multiple calendars) and the second "key" parameter is the Google Calendar™ ID that tells gCalMarkup where to find the calendar. (See the reference manual for instructions on finding the Calendar ID). The last parameter, "maxResults", is optional and tells gCalMarkup to only retrieve a single event.

Note that the mainTemplate element and the gCalDefine calendar command can both be anywhere in the article since both are removed by gCalMarkup and are not visible.