ブログ
WordPressでイベントスケジュールプラグイン「The Events Calendar」のテーマを編集するには
- Yuki Motomiya
- Director
某案件でWordpressにカレンダーを実装する事になり、自作は大ごとになるので「The Events Calendar」というプラグインを利用しました。
今回はこのプラグインの簡単な紹介とオリジナルテーマの作成方法を軽くまとめます。
The Event Calendarについて
The Event Calendarは名前の通りイベントカレンダーに特化したプラグインになります。
普通に作ると難しいカレンダーページを簡単に設置することができて、機能もカレンダーを表示だけでなく、イベントの特化した様々な機能が用意されてます。
- カレンダー表示以外にも一覧表示や日ごとの一覧表示
- 初期表示をカレンダー表示・一覧表示・日ごとの一覧表示選択
- 閲覧ユーザーはカレンダーアプリと連動（iCal・Googleカレンダーなど）
- 終了したイベント投稿に終了メッセージの表示、または一覧表示から自動的に非表示
- イベント会場、参加費、開始・終了時間設定
など十分すぎるほど機能が充実しております。
※さらに有料版Events Calendar PROでは定期的に行われるイベントの登録や週表示なども使い勝手がもっと良くなる機能が追加されます！フー！
オリジナルテーマ作成
標準テーマの場所
The Event Calendarにはプラグイン標準のテーマが用意されて以下のディレクトリに格納されてます。
wordpress/wp-content/plugins/the-events-calendar/views
viewsディレクトリの中にカレンダーページの表示に関わるファイルがあるのでこちらを編集、、
したいところですが、プラグインディレクトリ内にあるデータを編集してしまうとアップデートしたら編集したデータがまるまる差し代わってしまうことがあるのでpluginsディレクトリから直接編集は避けたい。
（The Event Calendarに限らず他のプラグインも直接pluginsディレクトリで編集しないように）
編集するには
pluginsディレクトリにある以上編集は直接編集出来ませんが、優秀なプラグインなので対策は用意されてます。
現在使用中のテーマディレクトリの中にtribe-eventsディレクトリを作成して、上記で説明したviewsディレクトリ内のデータをコピー。
先ほど作成したtribe-eventsディレクトリにviewsディレクトリからコピーしたファイルを格納。
最後にプラグインの設定画面「ベーシックテンプレート設定」にて2箇所選択すれば晴れてテーマを弄り回せるようになります。
- イベントテンプレートに使用するデフォルトスタイルシート
→ スケルトンスタイル - イベントテンプレート
→ デフォルトイベントテンプレート
各種テーマファイルの役割
The Event Calendarの標準テーマで用意されているファイルが多いです。
それぞれ目的に合ったテーマファイルの編集を行いますが、ファイルが多すぎてわからない！
ということで以下テンプレートの役割リストを作成してみましたので参考まで。（公式の直訳なので日本語おかしかったら教えてください）
イベントの単体表示用ファイル（詳細ページ）
- single-event.php
個々のイベントを表示するために使用。 - modules/address.php
イベント会場の住所等を表示するために使用。 - widgets/calendar-widget.php
WordPressウィジェット機能で使用。 - modules/meta.php
single-event.php内でイベントのメタ情報を表示するために使用。 - modules/meta/details.php
メタセクション内に開始時間や終了時間などの情報を追加します。 - modules/meta/map.php
メタセクション内に地図をレンダリング。 - modules/meta/organizer.php
オーガナイザー情報をメタセクションに追加。 - modules/meta/venue.php
会場情報をメタセクションに追加。
Day View（日ごとの表示）
- day.php
日ごとの表示に使用される親ファイル。 - day/content.php
日ごとの表示に使用するメインテンプレート。（タイトル・ナビ・ループなど） - day/nav.php
次回開催イベントと以前の開催イベントのリンク表示。 - day/loop.php
イベント投稿のループに使用。 - day/single-event.php
当日開催イベント投稿に会場情報、各種メタ情報などを表示。
List View（一覧表示）
- list.php
一覧表示に使用される親ファイル。 - list/content.php
一覧表示に使用するメインテンプレート。（タイトル・ナビ・ループなど） - list/nav.php
次のイベントリスト・前のイベントリストのリンク表示。 - list/loop.php
イベント投稿のループに使用。 - list/single-event.php
各イベント投稿に会場情報、各種メタ情報などを表示。
Month View（月別カレンダー表示）
- month.php
月別カレンダー表示に使用される親ファイル。 - month/content.php
月別カレンダーに使用するメインテンプレート。（タイトル・ナビ・ループなど） - month/mobile.php
カレンダー表示のモバイル版を表示するためのテンプレート。 - month/nav.php
次の月と前の月のカレンダーリンク表示。 - month/loop-grid.php
イベント投稿のループに使用。 - month/single-day.php
カレンダー表示の日数など表示。 - month/single-event.php
カレンダー表示のイベント名、リンクなど表示。 - month/tooltip.php
カレンダーの日程にカーソルを当てると表示されるツールチップ様テンプレート。
モジュール
- modules/bar.php
カレンダーのメインナビゲーション。 - modules/map.php
単一のイベント、または会場アーカイブに埋め込まれたGoogleマップを表示するテンプレート。
埋め込みイベント
- embed.php
埋め込み基本テンプレート。 - embed/content.php
埋め込みビューのコンテンツテンプレート。 - embed/cost.php
埋め込みビューのコストテンプレート。 - embed/footer.php
埋め込みビューのフッターテンプレート。 - embed/image.php
埋め込みビューのおすすめの画像テンプレート。 - embed/meta.php
埋め込みビューにメタ詳細を表示するためのテンプレート。 - embed/schedule.php
埋め込みビューのスケジュール詳細テンプレート。 - embed/venue.php
埋め込みビューの会場情報。
ウィジェット
-
widgets/list-widget.php
リストウィジェット用のテンプレート
PHPのバージョンとThe Events Calendarについて
2019年3月からThe Events CalendarはPHP 5.6より前のバージョンはサポート外になるそうです。
PHPバージョンが5.6以下の方はダッシュボードに警告が表示されているので確認してみてください。
以上、The Events Calendarインストールしてスケジュールがっつり埋めちゃいましょう！