スマホとPC両対応のホームページ作成、ご予約フォームの作成、
メルマガ配信、顧客管理機能までがまるっと一つになったリウムスマイル!

電話番号:06-6484-5445

営業時間:平日 9:00〜17:30

  1. グーグルカレンダーをリウムスマイル!のホームページに設定する方法

グーグルカレンダーをリウムスマイル!のホームページに設定する方法

2012/10/02

お店の予約状況や、営業日などをホームページに表示するのに、グーグルカレンダーを利用するととても便利です!

また、お客様にどの時間帯が空いているか一目で分かっていただくことができます。

 

グーグルカレンダーをホームページに貼り付ける手順と気を付けたいポイントについて解説いたします。

前提条件

googleのアカウントを取得していること

作業の流れ

1.グーグルカレンダーに新しいカレンダーをつくる

2.グーグルカレンダーのコードを取得する

3.リウムスマイル!のホームページにコードを貼り付ける

1.グーグルカレンダーに新しいカレンダーをつくる

1.メールアドレスとパスワードを記入してログインします。

2.グーグルカレンダーにアクセスします。

 

1.新しいカレンダーを作成する

1.マイカレンダーの左横の「▼」をクリックします

2.「新しいカレンダーを作成」をクリックします

今あるカレンダーを表示させたい方は、この部分は飛ばしても大丈夫ですが、

プライベート用のカレンダーが公開されてしまうより、可能であれば公開用の新しいカレンダーを作成したほうが良いでしょう。

 

2.カレンダーの公開設定を変更する

1.「カレンダー名」を記入します

2.「このカレンダーを一般公開する」にチェックを入れます

3.「カレンダーを作成」をクリックします

 

3.カレンダーの色を変更する

1.先ほど追加したカレンダーの左横「▼」をクリックします

2.設定したい色をクリックすると自動的に変更されます

カレンダー内での個別予定の色分けに関しては、

グーグルの使用により外部に表示される際には個別の予定の色は変更できない模様です。

 

 

2.グーグルカレンダーのコードを取得する

1.カレンダー設定を開く

1.先ほど追加したカレンダーの左横「▼」をクリックします
2.「カレンダー設定」をクリックします

 

2.貼り付けるコードを取得する

1.「色やサイズなどをカスタマイズします」をクリックします

 

1.「カレンダーのタイトル」に任意のタイトル名を記入します

2.横幅を指定します(推奨:740px)

3.縦幅を指定します(推奨:500px)

4.表示したいカレンダーにチェックを入れます

5.設定が完了したら「HTMLを更新する」をクリックします

6.コードを全てコピーします

 

 

3.リウムスマイル!のホームページにコードを貼り付ける

1.新しくフリーページを作成する

1.ホームページ「管理画面」-「ホームページパーツ一覧」

2.「フリーページ」の左から2番目「フリーページの子パーツを追加」をクリックします

 

2.コードを貼り付ける

1.本文領域をクリックしてツールバーを有効(ボタンの色が濃くなります)にした後に、ツールバーの1番右の「HTMLソース編集」をクリックします。

 

 

1.先ほどコピーしたグーグルカレンダーのコードを貼り付けます。

2.「HTMLソース編集」をクリックします

3.画面下部の「保存」をクリックします