LoginSignup
6
5

More than 5 years have passed since last update.

【Facebook】GoogleカレンダーをFacebookページに組み込む

Last updated at Posted at 2015-09-16

意外と情報を検索するのに苦労したので、覚書です。

※Facebookの仕様はコロコロ変わるので、2015/09/16現在ということで読み進めてください。

やりたいことは、↓こういうこと。
スクリーンショット 2015-09-16 20.25.43.png

では、面倒くさい説明は抜きにして、やり方の説明です。

(1)複数のFacebookページを管理していても、ログインしている個人アカウントで、以下のサイトへアクセス
スクリーンショット 2015-09-16 20.27.36.png
Facebookページに似たような名前で同じマークが存在しますが、「アプリ」にある"Static HTML:iframe tabs"を選択します。

(2)アプリの水色ボタンをクリック
スクリーンショット 2015-09-16 20.27.48.png

(3)管理しているFacebookページを選択
スクリーンショット 2015-09-16 20.30.00.png

(4)Edit tabをクリック
スクリーンショット 2015-09-16 20.32.33.png
ちなみに、このアプリでは、複数ページ作成できます。

(5)Googleカレンダーの「設定」>「カレンダー」で追加するカレンダーを選択し、サイズなどをカスタマイズしてhtmlをコピー
スクリーンショット 2015-09-16 20.34.36.png

このとき、サイズは810×520がちょうどいいそうです。

(6)(4)のFacebookのstatic HTML設定画面に戻り、index.htmlの編集エリアに(5)でコピーしたhtmlタグをペースト
スクリーンショット 2015-09-16 20.37.26.png

(7)Previewボタンで確認して問題なければ、Save & Publishボタンで保存し、右上にある"View on Facebook"をクリックしてFacebookページに追加されたかどうかを確認
スクリーンショット 2015-09-16 20.40.57.png
Welcomeと出ているところが、static HTMLアプリで追加したページです。
これだと何のページかわからないので、タイトルや順番を修正します。

(8)まずは、位置決めで、一つ左に動かします。
スクリーンショット 2015-09-16 20.42.12.png
「タブを管理」をクリックし、タブの順番を動かします。

スクリーンショット 2015-09-16 20.42.44.png

スクリーンショット 2015-09-16 20.42.52.png
ここで一旦保存します。

左に行きましたね。
スクリーンショット 2015-09-16 20.45.44.png

(9)次に、タイトルの変更です。「もっと見る」から、タブの管理を表示し、「タブの追加・削除」をクリック
スクリーンショット 2015-09-16 20.46.28.png

アプリの一覧にstatic HTMLが表示されるので、「設定を編集」をクリック
スクリーンショット 2015-09-16 20.46.41.png

カスタムタブ名を編集し、「保存」ボタン、「OK」ボタンで保存
スクリーンショット 2015-09-16 20.47.00.png

タブの名前が変更されました。
スクリーンショット 2015-09-16 20.49.38.png

この後は、Googleカレンダーに予定を追加していくと、このFacebookのページにも反映されます。
ぜひ!!

6
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
5