お知らせ 資料ダウンロード

無料でできる!ホームページに予約カレンダーを設置する方法とは?

予約 カレンダー

 

「予約カレンダーをホームページに設置したいけど、どうすればいいのか?」

 

ホームページに予約カレンダーを設置する方法には、おもに以下の3つの方法があります。

 

  • Googleカレンダーを利用する
  • 予約システムを活用する
  • WordPressのプラグインをインストールする

 

それぞれ異なる特徴があるので、自分に合った方法を選択することが重要です。

この記事では、予約カレンダーを設置する3つの方法について、メリット・デメリットや設定方法を詳細に解説します。

ホームページに予約カレンダーを設置するメリット

ホームページに予約カレンダーを設置するメリットは3つあります。

①イベントなどのスケジュールや開催状況がわかりやすい

レッスンやイベントなどの実施スケジュールをカレンダー形式で表示することで、予約者はイベントの開催日時や空き状況を一目で確認できます。

②告知から集客までを一連の流れでできる

事業者のみなさんは、予約カレンダーを設置したホームページやブログを告知するだけでOK。


予約者さんがみなさんのページに訪れ、そのまま予約ができ、ほかのページに遷移する必要はありません。ページの遷移が減ることで、利用者の途中離脱を最小限に抑えることができます。

③イベントの修正が簡単

レッスンの日程変更や追加、募集人員の増減など、予約を開始したあとの修正もありますよね。


そんなとき、カレンダーを埋め込んでいれば、ブログ記事やホームページを編集する必要はありません。


予約システム側で修正されたイベントは、カレンダーにも自動的に反映されますので、再告知などの手間を最小限に抑え、告知漏れなどのトラブルを防ぐことにもつながります。

ホームページに予約カレンダーを設置する方法

ホームページに予約カレンダーを設置する方法は、「Googleカレンダー」「予約システム」「WordPressのプラグイン」の3つがあります。

 

 

Googleカレンダー

予約システム

WordPressのプラグイン

メリット

比較的簡単に予約枠を作れる

充実した機能

無料から利用できる

カスタマイズ性に優れる

デメリット

1つの予​​約枠につき1名の予約のみ可能

高度な設定は不可

有料プランの場合費用がかかる

日本語対応しているプラグインは少数

こんな方におすすめ

簡易的な予約カレンダーで十分という方

カレンダー機能の充実で売上アップしたい方

WordPressユーザー

 

以下では、それぞれの方法におけるカレンダーの設置方法を解説します。

Googleカレンダーを埋め込む

まずは、GoogleカレンダーをWebサイトやブログに埋め込む方法を解説します。Googleカレンダーで予約枠を作る方法については別記事で解説していますので、そちらを参照ください。

【2022年最新】Googleカレンダーで予約枠を作る方法。無料でweb予約システムを作るには?

 

なお、Googleカレンダーの予約機能を使うには、有料(680円~)のGoogle Workspaceに申し込む必要があります。通常の無料のGoogleアカウントでは予約枠の機能が使えないのでご注意ください。

 

Googleカレンダーをホームページに埋め込むには、以下の手順を踏んでください。

 

まず、右上にある設定アイコンをクリックして「設定」をクリックします。

予約 カレンダー

 

次に、画面左側にある埋め込みたいカレンダーの名前をクリックします。

予約 カレンダー


「カレンダーの統合」に表示されたiframeの埋め込みコードをコピーします。

予約 カレンダー

 

コピーしたiframeコードを、お使いのホームページ作成ツールやブログサービスのエディターに貼り付けてください。

予約 カレンダー

 

そうすると、Googleカレンダーがページに表示されます。

予約 カレンダー


なお、埋め込んだカレンダーが表示されるのは、該当カレンダーを共有しているユーザーのみです。カレンダーを一般公開するには、アクセス権限を設定する必要があります。

予約 カレンダー

 

「予定のアクセス権限」セクションで「一般公開して誰でも利用できるようにする」のチェックボックスをオンにします。

 

予約システムでカレンダーを生成して埋め込む

予約システムはいくつも種類がありますが、今回はそのなかでも、無料から使えて多種多様な業種に適した予約システム「 STORES 予約 」を使い、カレンダーを作成する方法をお伝えします。

 

①まずはSTORES 予約 のアカウント作成

STORES 予約 は無料から使い始めることができますが、カレンダーの外部埋め込みはスダンダードプラン(月額26,378円(税込))以上のプランで利用できます。

 

STORES 予約 の導入費用に関してはSTORES 予約で予約システムを運用するときにかかる料金・費用まとめの記事に詳しくまとめています。

 

現在、1週間無料でスタンダードプランをご利用できるキャンペーン中ですので、ぜひ試してみてください。

STORES 予約 に無料登録する

 

②予約ページを作成

予約 カレンダー

 

4つの予約ページタイプから業種に業態にあった予約タイプを選択します。
なお、予約ページは複数作成でき、作成と同時にそれぞれの予約ページ専用の予約台帳が自動作成されます。


予約ページの作成方法に関しては、【予約システム】STOERS 予約の初期セットアップ方法 《その1》の記事が参考になります。

 

③カレンダーに設置

アカウントを作成したら、右上の管理メニューから「予約ボタンを設置」をクリック。

 

予約 カレンダー

予約システムをホームページに導入するにあたり「ボタン」「カレンダー」「バナー」の形式が選べるので、「予約カレンダー」をクリック。

 

予約 カレンダー

 

設置方法を選択。


カレンダーに表示する対象は
すべての予約ページ
・選択した予約ページ


から選ぶことができ、選択した予約ページの場合は、任意の予約ページを複数選択できます。

 

次にパソコンとスマートフォンそれぞれでの見た目を選択。
月、週、3日、日、予定のリストから選択できます。
少し下の動作確認で、どのようにページが表示されるかのイメージが確認できるのがうれしいですね。

 

最後に、自動生成されたコードをコピーして、予約システム側の作業は終了です。

 

予約 カレンダー

④ホームページに貼り付け

③でコピーしたコードを、ホームページやブログなどに貼り付けます。
iframe形式に対応したサービスであれば、設置可能です。
詳しくはお使いのサービスをご確認ください。

アメブロへの設置方法はこちら


※Tips
埋め込むカレンダーの色の変更もできます。
各予約ページ > 左カラムこだわり設定 > カレンダーの色の変更
こちらでお好きな色を選んでいただけます。


お店の世界観に合わせて選んだり、コースやメニューによって色を変えたりするのがおすすめです!

 

予約 カレンダー

プラグインを使用する(WordPressの場合)

WordPressの場合、拡張機能「プラグイン」をインストールして予約カレンダーを設置できます。ちなみに、プラグインはその多くが無料で利用できます。

 

プラグインをインストールするには、まずWordPressのダッシュボードから「プラグイン」→「新規追加」を選択します。

予約 カレンダー

 

検索窓にプラグイン名を入力して、目的のプラグインを探します。

予約 カレンダー

 

プラグインのなかにはWordPressの管理画面からは検索できず、プラグインの公式サイトからしかダウンロードできないものもあります。そのようなプラグインは、公式サイトからダウンロードしたZip形式のプラグインファイルをアップロードして使用します。

予約 カレンダー

 

目的のプラグインを検索あるいはZipファイルをアップロードしたら、インストールして有効化します。そうすると、そのプラグインの機能を利用できるようになります。

 

予約カレンダーを生成できるプラグインはいくつか種類がありますが、おすすめは「Booking Package」です。さまざまな業種の予約タイプに対応しており、機能性も十分。日本語にも対応しており操作も直感的におこなえます。

 

スケジュールは曜日、1日単位で予約スケジュールを作成することが可能。時刻や間隔、締め切り、定員など詳細に設定できます。

予約 カレンダー

 

予約者情報の入力フォームの項目もカスタマイズできます。郵便番号や住所など不要な項目は削除可能です。

予約 カレンダー

 

作成した予約カレンダーはショートコードを使うことで、投稿ページや固定ページに簡単に設置できます。出力されるカレンダーは以下のように非常にシンプルで見やすいデザインになっています。

予約 カレンダー

 

カレンダーのフォントは背景色などデザインのカスタマイズも可能。業種業態やビジネスのイメージに合わせて変更できます。

予約 カレンダー

 

このように、機能性やカスタマイズ性、利便性に優れており、WordPressで予約カレンダーを作るならまず試したいプラグインです。

 

Booking Package ダウンロードページ

 

そのほかのおすすめプラグインについては、以下の記事にまとめています。

WordPressで予約システムを作るには?おすすめの無料プラグイン10選

カレンダーの生成・埋め込みに予約システムを使うべき理由

ここまで見てきたように、ホームページに予約カレンダーを設置する方法は複数あります。そのなかでも特におすすめなのは、予約システムを活用する方法です。

無料で予約システムを作るのにおすすめな STORES 予約のメリット・デメリットは?

 

なぜ、予約カレンダーの生成・埋め込みに予約システムを使うべきなのか、その理由をご紹介します。

高機能

予約システムは単なるカレンダー生成ツールではありませんし、予約受付のためだけのツールでもありません。事前決済や顧客管理、予約回数の制限、リクエスト制の予約など、専用ツールならではの幅広い機能を持ちます。

直観的な操作による簡単設定

カレンダー機能を利用したいけれどパソコンやスマートフォンの操作が苦手という理由で、まだ使っていない方もいらっしゃるでしょう。

 

予約システムのカレンダー機能の操作は直感的にできるように設計されており、パソコンやスマートフォンに関する専門的な知識がなくても簡単に操作できます。HTMLやCSSなどWebの専門知識も不要です。

Googleカレンダーとの連携も可能

すでにGoogleカレンダーを使われている場合、Googleカレンダーとの連携も可能です。

 

Googleカレンダーでも予約受付はできますが、Googleカレンダーの機能では1つの予約枠につき1名の予約しかできません。さらに予約いただいた方のGoogleアカウントにヒモづいた氏名・メールアドレス・予約希望日時などの通知はありますが、その他の情報は不明です。

 

より便利に使いたいときは、Googleカレンダーと予約システムを連携して使うことをおすすめします。

【徹底解説】予約システム STORES 予約 とGoogleカレンダーを無料で連携する方法

 

Googleカレンダーを利用して予約を受け付けている方向けの予約システムの解説資料は、こちらからダウンロード可能です。Googleカレンダーを使った予約で残る課題や予約システムの機能などに関する資料がご覧いただけます。

 

 

STORES 予約

新規導入の電話相談はこちら
TEL:03-6705-8497
(平日10:00−18:00)

予約システム STORES 予約

関連記事