tinyMCE hCalendar Plugin

Alarm Clock The tinyMCE hCalendar plugin was created to allow programs which use the tinyMCE WYSIWYG editor to more easily implement the hCalendar microformat. hCalendar is a method of adding calendar data to a normal HTML page so that machines can understand it. This will allow search engine spiders, microformat aware web browsers, and and other programs to detect that your site contains a reference to an event, and to do things with the specific data about that event.

For more information about what microformats are, please visit the microformats page.

(Please note: this plugin is in currently in beta, so it may have some undocumented bugs. If you find any, please send them to
bugs [at] undergroundwebdesigns.com)


Installation Instructions:

(NOTE: see this post for step by step instructions on how to use this plugin with MODx)

  1. Download the tinyMCE hCalendar v0.2 plugin. (Note, the plugin only works in tinyMCE 3+).
  2. Unzip the archive, and open the hCalendar Plugin folder.
  3. Inside this folder you will find a folder named hcalendar, and a readme file containing these installation instructions.
  4. Upload the hcalendar folder to your tinyMCE installation's plugins directory.
  5. Add "hcalendar" to the list of included plugins in your tinyMCE.init line, and also add "hcalendar" to one of the button rows. Here is an example tinyMCE.init line with just hCalendar installed:
tinyMCE.init({
            mode : "textareas",
            theme : "advanced",
            plugins : "hcalendar",
            theme_advanced_buttons1 : "hcalendar"
        });

The plugin should now be installed. If everything has worked out correctly, there will be a new icon in your tinyMCE toolbar that looks like this: hcalendar button


Using the plugin:

1. To use the plugin, open the document you wish to edit in your tinyMCE editor, place the cursor where you wish to insert your event, and click the hCalendar button: hcalendar button. This will open a popup box where you can enter the event's title, location, url, start and end dates / times, a description, and some tags.

Once you've entered your event details, click the "Insert" button to create your event.

The event will be added into your document at the current cursor location, in the following form:

StartDate - EndDate: Event title at Location 

Description 

Tags 

If you input a URL, the entire first line becomes a link to that URL. Besides displaying nicely on the page, the plugin also marks up your data following the hCalendar microformat, so that computer programs and spiders can understand it.


Known Issues:

The plugin does not seem to work properly in Safari on the Mac, the outer Div (which defines the event) is removed. This means that events created in Safari will not be recognized by microformat tools. This could be a limit of tinyMCE in Safari. 


Changes:

Version 0.2:

  • Fixed a bug that caused the dialog to read dates incorrectly when editing an existing event.

Version 0.1:

  • Initial Release

 


 

Bugs:

If you use the plugin and find a bug, or have a feature request, please send it to bugs [at] undergroundwebdesigns.com.


Donations:

If you find this plugin useful, please consider leaving a small donation to help support the development of more plugins, and to keep me encouraged! 

Thanks! 


 Licence and Attribution:

Creative Commons License
tinyMCE hCalendar Plugin by Alex Willemsma is licensed under a Creative Commons Attribution-Share Alike 3.0 Unported License.
Based on the hCalendar Creator at microformats.org