イベントカレンダープラグインの使い方

ゲームのイベントスケジュールをガントチャート形式で表示するプラグインです。
開催中のイベント・ガチャ・メンテナンスなどを視覚的に一覧でき、カテゴリごとの色分けやフィルター、残日数表示にも対応しています。
PC・スマートフォンの両方で動作します。



はじめに:こんなことができます

  • イベントの期間をガントチャート(横棒)で一覧表示
  • カテゴリごとに色分け(イベント・ガチャ・メンテナンスなど)
  • 「今日」の位置を赤い線で表示
  • 開催中のイベントに「あと○日」の残日数バッジを表示
  • 終了済みイベントは半透明になり、開催中・予定のイベントと区別できる
  • 2週間表示と月表示を切り替え可能
  • カテゴリフィルターで特定の種類だけ表示/非表示
  • ダークモード/ライトモードの切り替え(設定はブラウザに保存)
  • イベント名にWiki内リンクや外部リンクを設定可能
  • バーにマウスを乗せると期間・日数・ステータスをポップアップ表示
  • 開始時刻・終了時刻の指定に対応し、ポップアップに時刻や残り時間を表示

2ステップで始める

まずは最小限の手順で動くカレンダーを作ってみましょう。

ステップ1:ページにイベントデータを書く

ページの編集画面を開いて、以下のように書きます。

#eventcalendar{{
20260212,20260218,バレンタインクエスト2026,event
20260214,20260228,大イベント魔王爆誕,event
20260215,メンテナンス v4.5,maintenance
20260212,20260225,チョコレートガチャ,gacha
}}

1行が1つのイベントです。書き方は以下の通りです。

開始日,終了日,イベント名,カテゴリ名

ステップ2:ページを保存して確認

ページを保存すると、ガントチャートが表示されます。
今日の日付に赤い線が引かれ、開催中のイベントには「あと○日」バッジが付きます。

これだけで基本的なイベントカレンダーは完成です!
ここから先は、時刻指定やカテゴリの色変更、リンク設定などの応用機能の説明です。

日付と時刻の書き方

日付の形式

日付は以下の3つの形式に対応しています。どれを使ってもOKです。

形式記述例
スラッシュなし20260215
ハイフン区切り2026-02-15
スラッシュ区切り2026/02/15

時刻の指定(任意)

日付の後ろにスペースを空けて時刻(HH:MM形式)を書くと、ポップアップに時刻が表示されます。

時刻を省略した場合は終日扱いになります。

20260216 14:00,20260228 16:00,[[海灯祭2026]],event

この場合、ポップアップの期間表示は「2026/02/16 14:00 ~ 2026/02/28 16:00」となります。

ガントチャートのバー表示は日単位のままで変わりません。

時刻を指定すると、以下のような詳細なステータス表示が有効になります。

  • 本日終了のイベントに「残り○時間○分」を表示
  • 明日終了のイベントに「明日 16:00まで」を表示
  • 本日開始のイベントに「本日 14:00 開始」を表示

1日だけのイベント

終了日を省略すると、1日だけのイベントとして表示されます。

時刻の指定も可能です。

20260215 11:00,メンテナンス v4.5,maintenance

この場合、2026年2月15日の1日間のイベント(11:00開始)になります。

カテゴリの設定

デフォルトカテゴリ

何も定義しなくても、以下の6つのカテゴリがあらかじめ用意されています。

カテゴリ名表示名
eventピンク(#f06292)イベント
gachaグリーン(#66bb6a)ガチャ
campaignブルー(#42a5f5)キャンペーン
maintenanceオレンジ(#ffa726)メンテナンス
storyパープル(#ab47bc)ストーリー
defaultグレー(#78909c)その他

イベント行の末尾にカテゴリ名を書くと、その色でバーが表示されます。
カテゴリを省略した場合は default が使われます。

カテゴリの色やラベルを変更する

デフォルトの色やラベルを変えたい場合、category行 で上書きできます。
イベントデータの前に書いてください。

#eventcalendar{{
category:event,#ff4081,限定イベント
category:gacha,#00e676,ピックアップ
20260212,20260218,バレンタインクエスト2026,event
20260212,20260225,チョコレートガチャ,gacha
}}

category行の書き方は以下の通りです。

category:カテゴリ名,色コード,表示ラベル
項目説明
カテゴリ名英数字のIDevent
色コード#から始まるカラーコード#ff4081
表示ラベルフィルターやポップアップに表示される日本語名限定イベント

リンクの設定

イベント名をクリックでページ遷移するリンクにできます。

Wiki内リンク

イベント名をページ名として扱い、そのページへリンクします。

20260212,20260218,[[バレンタインクエスト2026]],event

Wiki内リンク(表示名とページ名を分ける)

表示名とリンク先ページ名を別々に指定できます。

20260212,20260218,[[バレンタインクエスト2026>イベント/バレンタインクエスト2026]],event

外部リンク

http:// または https:// で始まるURLを指定すると、外部サイトへのリンクになります。
外部リンクは自動的に新しいタブで開きます。

20260212,20260218,[[バレンタインクエスト2026>https://example.com/event]],event

リンクなし

[[ ]] を付けなければ、クリックできないただのテキストになります。

20260212,20260218,バレンタインクエスト2026,event

カレンダーの操作方法

表示切替

ボタン機能
2週2週間分のカレンダーを表示(デフォルト)
1ヶ月分のカレンダーを表示
◀ ▶前後の期間に移動
今日今日を含む期間にジャンプ
🌓ダークモード/ライトモードの切り替え

テーマの設定はブラウザに保存されるため、次回アクセス時も同じテーマで表示されます。

カテゴリフィルター

カレンダー上部に表示されるカテゴリチップをクリックすると、そのカテゴリの表示/非表示を切り替えられます。
例えば「メンテナンス」だけ非表示にしたい場合は、メンテナンスのチップをクリックしてください。

イベントバーの操作

PCの場合

操作動作
バーにマウスを乗せるポップアップで期間・日数・カテゴリ・ステータスを表示
マウスを離すポップアップが閉じる
イベント名のテキストをクリックリンクが設定されている場合、そのページに遷移

スマートフォンの場合

操作動作
バーの色部分をタップポップアップを表示(リンク遷移はしない)
イベント名のテキストをタップリンクが設定されている場合、そのページに遷移
バー以外の場所をタップポップアップを閉じる

ポップアップの表示内容

バーにマウスを乗せる(スマホではタップする)と、以下の情報がポップアップで表示されます。

  • イベント名
  • 期間(時刻指定がある場合は時刻も表示)
  • 日数
  • カテゴリ
  • ステータス

ステータスは状況に応じて以下のように変化します。

状況表示例
開催中(残り複数日)🟢 開催中(あと5日)
開催中(明日終了・時刻あり)🟢 開催中(明日 16:00まで)
開催中(本日終了・時刻あり)🔴 本日終了(残り2時間16分)
開催中(本日終了・時刻なし)🔴 本日終了
開始前(本日開始・時刻あり)🔵 本日 14:00 開始
開始前(本日開始・時刻なし)🔵 本日開始
開始前(複数日後)🔵 3日後に開始
終了済み⚫ 終了

残り時間の表示はポップアップを開いた時点でのリアルタイム計算です。

サマリー表示

カレンダー下部に、現在のフィルター条件での開催中・開催予定・終了の件数が表示されます。

コメント行

// で始まる行はコメントとして無視されます。メモや区切りに使えます。

#eventcalendar{{
// === カテゴリ定義 ===
category:event,#f06292,イベント
category:gacha,#66bb6a,ガチャ

// === 2月のイベント ===
20260212,20260218,[[バレンタインクエスト2026]],event
20260212,20260225,[[チョコレートガチャ]],gacha

// === メンテナンス ===
20260215,メンテナンス v4.5,maintenance
}}

空行も無視されるため、見やすく整理できます。

記述リファレンス

プラグイン全体の構文をまとめます。

#eventcalendar{{
category:カテゴリ名,色コード,表示ラベル
開始日,終了日,イベント名,カテゴリ名
開始日,イベント名,カテゴリ名
}}

イベント行の引数

項目必須説明
開始日必須イベント開始日(YYYYMMDD / YYYY-MM-DD / YYYY/MM/DD)
開始時刻任意開始日の後にスペースを空けて HH:MM 形式で指定
終了日任意イベント終了日(省略時は開始日と同じ=1日イベント)
終了時刻任意終了日の後にスペースを空けて HH:MM 形式で指定
イベント名必須イベントの表示名([[ ]]でリンク可)
カテゴリ名任意category行で定義したカテゴリ名(省略時はdefault)

category行の引数

項目必須説明
カテゴリ名必須英数字のID(event, gacha など)
色コード必須バーの色(例: #f06292, #66bb6a)
表示ラベル必須フィルターやポップアップに表示される名前

総合的な記述例

カテゴリ定義・各種リンク・コメントをすべて活用した実践的な例です。

#eventcalendar{{
// === カテゴリ定義 ===
category:event,#f06292,イベント
category:gacha,#66bb6a,ガチャ
category:campaign,#42a5f5,キャンペーン
category:maintenance,#ffa726,メンテナンス
category:story,#ab47bc,ストーリー
category:real,#ef5350,リアルイベント
category:collab,#26c6da,コラボ
category:pvp,#ff7043,PvP

// ============================================================
// 2025年12月
// ============================================================
20251201 11:00,20251214 14:59,[[冬の序章・氷結の試練]],event
20251201 11:00,20251221 14:59,[[氷姫カティア ピックアップ]],gacha
20251203 6:00,20251203 11:00,メンテナンス v3.8,maintenance
20251205 11:00,20251219 14:59,[[ログインボーナス・冬の贈り物]],campaign
20251207 11:00,20251207 23:59,[[闘技場シーズン14 プレシーズン]],pvp
20251208 11:00,20251222 14:59,[[蒼穹の剣士ガチャ]],gacha
20251210 11:00,20251224 14:59,[[極寒ダンジョン・凍てつく深淵]],event
20251212,20251212,[[公式生放送 v4.0特番]],real
20251214 15:00,20251228 14:59,[[第3章 前編公開]],story
20251215 11:00,20251231 23:59,[[歳末キャンペーン2025]],campaign
20251217 6:00,20251217 12:00,メンテナンス v3.8.1(緊急),maintenance
20251218 11:00,20260101 4:59,[[聖夜の舞踏会]],event
20251220 11:00,20260103 14:59,[[聖夜限定 雪華のルミナ ピックアップ]],gacha
20251222 11:00,20260105 14:59,[[年末年始ログインボーナス]],campaign
20251224 18:00,20251225 4:59,[[クリスマス限定クエスト]],event
20251225 11:00,20260108 14:59,[[福袋ガチャ2026]],gacha
20251228 11:00,20260111 14:59,[[カウントダウン・除夜の鐘]],event
20251230 11:00,20260113 14:59,[[新春限定 紅蓮の巫女エリカ]],gacha
20251231 20:00,20260101 3:59,[[年越し特別クエスト]],event

// ============================================================
// 2026年1月
// ============================================================
20260101 0:00,20260107 23:59,[[新年あけおめキャンペーン]],campaign
20260103 11:00,20260117 14:59,[[迎春・初夢の冒険]],event
20260105 11:00,20260119 14:59,[[新春復刻 炎帝マグナス]],gacha
20260107 6:00,20260107 12:00,メンテナンス v4.0,maintenance
20260108 11:00,20260122 14:59,[[第3章 後編公開]],story
20260110 11:00,20260124 14:59,[[闘技場シーズン14 本戦]],pvp
20260112 11:00,20260126 14:59,[[凍土の探索・永久凍霜の地]],event
20260114 11:00,20260128 14:59,[[双剣のセレナ ピックアップ]],gacha
20260117 11:00,20260131 14:59,[[報酬2倍キャンペーン]],campaign
20260119 11:00,20260202 14:59,[[雪原レイド・氷竜ヴリトラ]],event
20260121 6:00,20260121 11:00,メンテナンス v4.0.1,maintenance
20260121 11:00,20260204 14:59,[[蒼天の弓使いリーナ]],gacha
20260124 11:00,20260207 14:59,[[素材収集キャンペーン]],campaign
20260126 11:00,20260209 14:59,[[幻影の塔チャレンジ]],event
20260128 11:00,20260211 14:59,[[闇の魔導士ゼクス ピックアップ]],gacha
20260131,20260131,[[公式ニコ生 2月アプデ情報]],real

// ============================================================
// 2026年2月
// ============================================================
20260201 11:00,20260215 14:59,[[節分イベント・鬼退治大作戦]],event
20260203 6:00,20260203 12:00,メンテナンス v4.1,maintenance
20260204 11:00,20260218 14:59,[[恵方巻コラボ・グルメファンタジー]],collab
20260205 11:00,20260219 14:59,[[聖騎士アルトリア ピックアップ]],gacha
20260207 11:00,20260221 14:59,[[闘技場シーズン15 予選]],pvp
20260210 11:00,20260224 14:59,[[バレンタイン・甘い約束]],event
20260212 11:00,20260226 14:59,[[バレンタイン限定 ショコラティエ・ミア]],gacha
20260214 0:00,20260214 23:59,[[バレンタインデー限定ログボ]],campaign
20260215 11:00,20260301 14:59,[[第4章 前編公開]],story
20260217 6:00,20260217 11:00,メンテナンス v4.1.1,maintenance
20260218 11:00,20260304 14:59,[[復刻 雪華のルミナ]],gacha
20260220 11:00,20260306 14:59,[[経験値3倍キャンペーン]],campaign
20260222 11:00,20260308 14:59,[[古代遺跡探索・砂漠の秘宝]],event
20260225 11:00,20260311 14:59,[[風の踊り子フィーナ ピックアップ]],gacha
20260228 11:00,20260314 14:59,[[ギルドバトル・春の陣]],pvp

// ============================================================
// 2026年3月
// ============================================================
20260301 11:00,20260315 14:59,[[春風の祝祭・桜舞う園]],event
20260303 6:00,20260303 12:00,メンテナンス v4.2,maintenance
20260305 11:00,20260319 14:59,[[桜花の姫ハルカ ピックアップ]],gacha
20260307 11:00,20260321 14:59,[[ホワイトデー・お返しクエスト]],event
20260309 11:00,20260323 14:59,[[スタミナ半額キャンペーン]],campaign
20260312 11:00,20260326 14:59,[[大魔術師メルリン復刻]],gacha
20260314,20260314,[[AnimeJapan出展情報公開]],real
20260315 11:00,20260329 14:59,[[第4章 後編公開]],story
20260318 6:00,20260318 11:00,メンテナンス v4.2.1,maintenance
20260319 11:00,20260402 14:59,[[竜騎士レオン ピックアップ]],gacha
20260321 11:00,20260404 14:59,[[春分の日ログインボーナス]],campaign
20260322 11:00,20260405 14:59,[[闘技場シーズン15 本戦]],pvp
20260325 11:00,20260408 14:59,[[魔獣討伐戦・森の守護者]],event
20260328 11:00,20260411 14:59,[[月末限定 天空のアリア]],gacha
20260329,20260329,[[AnimeJapanステージイベント]],real
20260330 11:00,20260413 14:59,[[お花見キャンペーン]],campaign

// ============================================================
// 2026年4月
// ============================================================
20260401 0:00,20260401 23:59,[[エイプリルフール特別クエスト]],event
20260402 6:00,20260402 12:00,メンテナンス v4.3,maintenance
20260403 11:00,20260417 14:59,[[新学期・入学式の冒険]],event
20260405 11:00,20260419 14:59,[[制服限定 学園長ソフィア]],gacha
20260408 11:00,20260422 14:59,[[コラボ・異世界食堂]],collab
20260410 11:00,20260424 14:59,[[ゴールド2倍キャンペーン]],campaign
20260412 11:00,20260426 14:59,[[閃光の剣聖ジーク ピックアップ]],gacha
20260415 11:00,20260429 14:59,[[第5章 序章公開]],story
20260418 6:00,20260418 11:00,メンテナンス v4.3.1,maintenance
20260420 11:00,20260504 14:59,[[闘技場シーズン16 予選]],pvp
20260422 11:00,20260506 14:59,[[春の大感謝祭]],campaign
20260425 11:00,20260509 14:59,[[古代機兵レイド・鋼鉄の巨神]],event
20260427 11:00,20260511 14:59,[[水着先行 常夏のリノア]],gacha
20260429 11:00,20260513 14:59,[[GW特別ログインボーナス]],campaign

}}

▼実際の見え方

📅イベントスケジュール

よくある質問

Q. イベントが表示されません

以下を確認してください。

  • 各項目がカンマ(,)で正しく区切られているか
  • 日付が正しい形式(YYYYMMDD等)で書かれているか
  • 行の先頭に余計なスペースが入っていないか
  • 存在しない日付(2月30日など)を指定していないか

Q. カテゴリの色が反映されません

category行はイベントデータの前に書く必要があります。
また、category行のカテゴリ名とイベント行のカテゴリ名が完全に一致しているか確認してください(大文字・小文字は区別されません)。

Q. 1つのページに複数のカレンダーを置けますか?

はい、可能です。#eventcalendar{{ ... }} を複数書けば、それぞれ独立したカレンダーとして表示されます。

Q. イベント数に上限はありますか?

1つのカレンダーにつき最大2,000件のイベントを登録できます。
実際に画面に描画されるのは現在表示中の期間に含まれるイベントだけなので、件数が多くても動作は軽快です。
終了したイベントを含め、蓄積していっても問題ありません。

Q. テーマ(ダーク/ライト)の設定はどこに保存されますか?

ブラウザのlocalStorageに保存されます。
同じブラウザであれば、次回アクセス時も前回のテーマ設定が引き継がれます。
別のブラウザや端末では初期状態(ダークモード)で表示されます。

Q. スマートフォンでも使えますか?

はい、対応しています。画面幅に応じて自動的にレイアウトが調整されます。
カレンダーは横スクロールで全期間を確認できます。
バーの色部分をタップするとポップアップが表示され、イベント名のテキスト部分をタップするとリンク先に遷移します。

バー以外の場所をタップするとポップアップが閉じます。

バージョン履歴

バージョン日付内容
1.2.02026-02-23スマートフォンでバー上のスワイプによる横スクロールに対応。ポップアップの画面端見切れを修正。box-sizing修正によるバーのセルはみ出しを修正。
1.1.02026-02-16時刻指定に対応(ポップアップに時刻・残り時間を表示)。
スマートフォンのタップ動作を改善(バー色部分タップ→ポップアップのみ、テキストタップ→リンク遷移、バー外タップ→ポップアップ閉じ)。
1.0.02026-02-16初版リリース。
ガントチャート表示、カテゴリ色分け、フィルター機能、2週間/月表示切替、
ダーク/ライトテーマ、残日数バッジ、Wiki内リンク・外部リンク対応、
ツールチップ、サマリー表示、レスポンシブ対応。


Last-modified: 2026-02-23 (月) 14:35:00