WordPressテーマで使えるシンプルイベントカレンダー(仮称)。
2023年05月03日
WordPressでカレンダーを使いたい目的はいくつもあります。しかし既存の方法は「帯に短し襷に長し」でした。そこでカスタムフィールド「イベント日程」の日付に投稿タイトルをカレンダー形式で表示するだけ!のシンプルなイベントカレンダーを作成しました。
これまでのカレンダーは。
- 本来のブログ用として、投稿をした日を表示したい。
- できれば投稿タイトルも表示したい。
- 未来の予定・イベントを表示したい。
1.投稿カレンダー
これはWordPress標準のウィジェット「カレンダー」で実現できます。
ただしカレンダーを表示して、投稿がある日に印(色が変わる等)がつくだけです。・・何の意味があるのだろう?と、初めてWordPressに触った時から不思議に思っている機能です。
2.投稿のカレンダー形式一覧表示
こちらの記事で紹介している「投稿タイトルを表示できるカレンダー」です。
多分に自己満足な気もしますが、投稿内容によっては大変有用です。
- 日記、創作物の紹介、その他時系列で見せたい記事の場合。
- WordPressの予約投稿を解除すれば、イベントカレンダーとしても使えます。予約投稿の解除はfunctions.phpで行えます。
標準ウィジェットではできない「投稿タイトルの表示」が可能です。
3.イベントカレンダー
高機能なプラグインが多数公開されています。
- Event Organiser
- Modern Events Calendar Lite
- Sugar Calendar (Lite)
- The Events Calendar
- WordPress Editorial Calendar
- WP Event Manager
- WP FullCalendar
- XO Event Calendar
ざっと調べるだけでも出てくる出てくる!特にEvent Organiserは多機能で評判も良く、弊社でも使用しています。
ただしどれにも共通する問題があります。
- 多機能故に設定が複雑。
- サイトごとに細かい設定をいちいちしなければならない。CSSの読み込み等はサイトに合わせて調整せねばならず煩雑。
- JSを使っているので他のプラグインとコンフリクトしやすい。
- デザインテイストが独特。サイト全体に馴染ませるのが大変。
- イベントは「カスタム投稿」として扱われるので、使い方を教えるのが難しい。
- こんなに機能はいらない・・・・・。
シンプルイベントカレンダー(仮称)は投稿をカレンダーに表示します。
ここで紹介するシンプルイベントカレンダー(仮称)は、実にシンプルです。
- 投稿に日付カスタムフィールド(イベント日程)が設置されていて、そこで指定した日付に投稿を表示します。投稿日は関係ありません(ここが投稿のカレンダー形式一覧表示と異なります)。
- カテゴリーから「イベント」を選びます。
- 投稿ページにイベント日程(日付)を表示します。
以上です。
PCでの表示。
スマホでの表示。
単ページ。投稿日とは別にイベント開催日を表示します。
イベント日程設定もカレンダーをクリックするだけ。
メリット。
- シンプルなので使い方を覚えるのがかんたんです。直感的に使えます。
- 全て投稿として扱われるので、他のページからの呼び出しも楽です。
- 独自のデザイン設定をする必要がありません。全体のスタイルシートに従います。
- 細かい設定をしなくても動きます。
- イベント終了後はそのままアーカイブとして残せます。レポート等を追加しておくのも良いでしょう。
設置時のメリット。
- functions.phpでカスタムフィールドを設定しているので、ACF等のプラグインは不要です。
- page-event-calendar.phpを設置します。
- スタイルシートにカレンダー表示(スマホ/PC用)を追記します。
- カテゴリーに「イベント(スラッグ:event)」を設定します。
- single.phpにイベント日付を表示するよう改造します。
- 固定ページ「イベントカレンダー(スラッグ:event-calendar)」を公開します。
- JSはありません。
- 既存のサイトに追加設定する場合でもコンフリクトが起きず、「動かない!」ということがないように留意しました。また既存デザインにできる限り従うように調整しています。
近日、ソースコード・設置方法詳細・解説を投稿します。
この記事は2023/05/03に公開され2023/05/18に更新、530 views読まれました。
[…] WordPressテーマで使えるシンプルイベントカレンダー(仮称)。 […]