ドキュメンテーション
印刷ページ

お持ちのフェイスブック・ページに統合する方法

このチュートリアルでは、お持ちのフェイスブックページ上のフレームにSuperSaaSのスケジュールを統合する方法について説明します。
iframeはユーザーが自分のFacebookのページを離れることなく、あなたのスケジュールにアクセスすることができます。
予約ボタンの統合であれば、予約ボタンを追加するためのチュートリアルを参照ください。

統合のために必要なものは?

  • フェイスブック・ビジネス・ページ
  • SuperSaaSアカウント(少なくとも一つ以上のスケジュールが必要)

フェイスブック・ページにSuperSaaSスケジュールをフレームとして追加

  1. あなたのフェイスブック・ビジネス・ページへのログイン

  2. ブラウザで新たなウィンドウを開き、次のURLへ進みましょう。apps.facebook.com/static_html_plus/

  3. “ページにStatic HTMLを追加”を選択

    Add Static HTML
  4. もしあなたが複数のフェイスブック・ビジネス・ページを持っている場合、まず初めにスケジュールを統合したいページを選び、それから “Static HTMLを追加: iframe タブ”をクリックしてください。 Add Static HTML: iframe tabs

    Select page
  5. Static HTMLタブがあなたのフェイスブック・ビジネス・ページ上に現れます。

  6. 設定タブにある"HTMLタブの編集"をクリクして、左側のカラムからの"アプリ"を選択します。

    Edit settings
  7. 対象フレームの"設定を変更"を選択します。

    Edit settings
  1. デフォルト(初期設定)のWelcomeテキストを、あなたの好きなものに変更することが出来ます。
    例えば、Book now!等です。保存をクリックして下さい。

Change text
  1. ステップ6を繰り返すことで、デフォルト(初期設定)のスター画像を変更することが出来ます。
    Change, next to Custom tab image:をクリックして下さい。
    これによって、新たなページが開き、そこで画像をアップロードすることが出来ます。
    スター画像の上に移動し、Editをして下さい。

Click change Click edit
  1. ポップアップが開いて、コンピューターから画像を選択できます。 111 × 74 pixels.

    右クリックして "Save as…"・・・として保存”を選択するか、自分自身のボタンを作って下記の見本をダウンロード、利用することができます。
    例として(右クリックして'Save as…') 又は作成

Select an image Button 1 Button 2 Button 3
  1. 画像のプレビューが現れ、保存せずに確認することが出来ます。
    しかし、検索機能を用いてフェイスブック・ページに戻った場合、すでにその画像がフェイスブックページ上に表示されています。

Preview and navigate back to your page
  1. これらのデザイン変更を完了させたのち、iframeをページへ統合することが出来ます。
    作成したBook now!ボタンをクリックして下さい(Static HTMLタブ)。

    Click on the new book now button
  2. セクション無料のアプリに移動し、迅速な統合のためのウェブサイトのアプリを選択します。(それはHTMLアプリの代わりに作業することも可能です)

    Choose website Copy and paste the schedule URL
  3. 外部ページフィールドのURLへのスケジュールのURLを貼り付けます。
    [保存]をクリック&公開するスケジュールをスケーリングするためにスクロールバーを削除します。
    あなたのウェブサイトのプレビューを表示するには、[プレビュー]をクリックします。

    Preview Preview
SSLの設定によって現在のFirefoxではFacebook上で埋め込みページは表示されせん。SSL設定はSuperSaaS管理画面のAccess Controlで変更可能です。
(リンクの先頭がhttpsへ変更されます。 変更前はこちらhttp)
もしiframe内でスケジュールを表示したくない場合(800px幅のフェイスブックページ)、ボタンもしくはリンクを代わりに設置することが出来ます。
その場合、スケジュールはそれ自身のブラウザ・ウインドウ内に表示されます。

leadgateを使用してFacebookページのいいね増加を図る

自分のFacebookのページにスケジュールを統合したら、静的なHTMLアプリでleadgateを作成することができます。
leadgateを有効にした場合、スケジュールのフレームを参照する前に自分の情報を取得し、ポップアップが表示されます。

  1. 管理者モードで静的なHTMLのアプリを表示し、編集タブをクリックします。
    ついでLeadgate利用にチェックを入れます。

    Go to fangate
  2. leadgateを適用チェックを入れたら、ビジターへのメッセージを入力して保存 & 公開します。

    Enter a message for visitors Preview