icocのHPでは、カレンダー表示にfullcalendarを使用しています。
fullcalendarはjQueryのカレンダープラグインです。
このプラグインを使うとカレンダーを使ったUI画面を簡単に作成できますし、
オプション機能を使用したり、色々とカスタマイズも可能です。
googleカレンダーとの連携を行うライブラリもあるようでgoogleカレンダーで登録した予定の取り込み等も可能なようです。
試してないですが、便利そうですね。

今回はカレンダー上に予定を表示させる画面を追加することになり、
個人的にはこのプラグインを初めて使用しました。
そこでカレンダー表示方法の簡単なメモを残したいと思います。

・下記よりダウンロードしてサイト内に配置します。
「http://fullcalendar.io/download/」

・htmlファイルを作成し、配置したファイル（js、css）、をhead内で読み込みます。

・fullcalendarを読みこむscriptをhead内に記述します。

$(document).ready(function() {
$(‘#calendar’).fullCalendar({
// 設定、オプション等を記述
});
});

・body内の挿入したい箇所にID属性を追加します。

＜ＤＩＶ id=”calendar＞＜／ＤＩＶ＞

これでカレンダーが表示されます。

次回は設定、オプション等について書きたいと思います。