All-in-One Event Calendarの使い方ーWordPressプラグイン【初心者向け】

WordPressでイベントカレンダーを追加できるプラグイン【All-in-One Event Calendar】の使い方を初心者向けに解説した記事です。導入すると、シンプルなカレンダーを固定ページに表示することができます。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

WordPressのプラグインの使い方を初心者向けに紹介する記事です。

今回は、WordPressでイベントカレンダーを追加できるプラグインの1つである、All-in-One Event Calendarの使い方を紹介します。

 

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。

 

大石ゆかり

田島メンター!!イベントカレンダーをWordPressで作れるらしいんですけど、どうやるか知っていますか〜??

田島悠介

それなら、「All-in-One Event Calendar」はどうかな。

大石ゆかり

名前からイベントカレンダーが作れそうですね!どうやってつかうんですか???

 

目次

本記事は下記の流れでご紹介します。

 

All-in-One Event Calendarとは

シンプルなカレンダーを、固定ページに表示することができるプラグインです。

シンプルながらも、GoogleカレンダーやiCalと連携することもできるので、イベント等が多い人は便利かもしれません。カレンダーは月や週間での表示もでき、ウィジェットにも対応しています。

All-in-One Event Calendar1

では、設定方法を見ていきましょう。

 

 

[PR] WordPressで挫折しない学習方法を動画で公開中

カレンダーを表示する固定ページを作成する

まず、カレンダーを表示する固定ページを作成しておきましょう。

作り方がわからない方は、WordPressの固定ページを作成する方法をご覧ください。

All-in-One_Event_Calendar3

 

 

 

プラグインをインストールする

このプラグインは、管理画面から「プラグインを検索」してインストールもできますし、プラグイン公式サイトからダウンロードすることも可能です。

インストールがわからない場合は、WordPressのプラグインをインストールする方法をご覧ください。

 

インストールするだけではプラグインが利用できないので、プラグイン管理画面に表示された「Click here to set it up now 」をクリックして設定をします。

All-in-One_Event_Calendar2

 

 

 

カレンダーを表示する

セッティング画面が開いているので、カレンダーを表示するページを選択しましょう。下記赤枠の部分で、先ほど作成した固定ページを選択してください。

できたら、ページ下部の「Save Settings」をクリックして保存します。

All-in-One_Event_Calendar4

 

 

先ほど作成した固定ページを見てみると、白紙のカレンダーが反映されています。また、赤枠部分を選択すると表示形式を変更することができます。

(1日単位、週単位、月単位、予定一覧)

All-in-One_Event_Calendar5

 

 

 

イベントを作成する

今のままではただカレンダーを表示しただけなので、イベントを作成していきましょう。

ダッシュボートに「Events」というメニューが増えているので、この機能を利用してイベントを追加していきます。

まずは「Add New」をクリックしてください。

All-in-One_Event_Calendar6

 

 

イベントの詳細を入力するタブがあるので、必要に応じて入力してください。

また、Googleマップも表示できます。
(入力欄は英語ですが、日本語で「東京ドーム」と打つと東京ドームの住所が表記されるなど、利用に問題はありません)

All-in-One_Event_Calendar7

 

 

その下に通常の入力フォームがあるので、イベントの説明などを追加しましょう。

All-in-One_Event_Calendar8

 

 

入力できたら、普通の記事と同じように「公開」をクリックしてください。

WordPress上のカレンダーページを見てみると、しっかりイベントが表示されています。

All-in-One_Event_Calendar9

 

 

また、イベント名をクリックすると、詳細情報が表示されます。

All-in-One_Event_Calendar10

今回の記事は以上です。

ぜひ自分のサイトにも導入してみてください。

 

他のイベントカレンダーを追加できるプラグインを使ってみたい場合は、The Events Calendarの使い方も合わせてご覧ください。

 

大石ゆかり

手軽にイベントカレンダーができましたね♪

田島悠介

そうだね。googleカレンダーやgoogleマップとも連携できるのもいいね♪

大石ゆかり

はい♪

 

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。