ロスジェネ彼女無しダメ人間がネットとケータイについてブログを書いたりします。

Facebookページをブログのようにボリボリ作れるサービスを作ってみた [ファンゲーター]

»

  • 要するにFacebookページの追加ページをブログのようにボリボリ作れるサービスです。
  • 『「いいね!」を押さないと見え​ないページがあるfacebookページ=ファンゲート』を簡単に作れます。
  • 通常必要なレンタルサーバーを借りる必要やスクリプトの設置がい​りません。
  • プログラムやスクリプトを作る必要もありません。
  • Google様のクラウドサーバー(GAE)に設置します。
  • Google様のクラウドなので​何百万アクセスが来ても自動的に負荷分散をします。
  • 法人様のページでも使用できます。
  • 無料です。
  • 導入するとファンページにHTML編集画面が出てきますので、HTMLを編集したり、画像をアップロードしたりするだけです。
  • 単純にFacebookページの配信サーバーにも使えます。
  • 通常必要なIFRAMEのAppをファンページに乗せるために必要なクレジットカードによる本人認証もしないで作れます。こっちで認証したアプリの上に乗せてます。
  • 今のところアルファ版です。9月上旬正式運用予定です。
  • もちろん、商用利用も可ですが…アルファ版なので責任は取りかねます。
  • 商用有料プランが9月登場予定です。
  • 誰もマネしかいかもしれませんが、ビジネスモデル特許を申請しました。ユーザーが作成したソーシャルネットワーク内の個別ページにおいて評価データ依存(「いいね!」を押されたかどうか等)でページ配信を振り分けるプログラムの設置を自動化することに特許を申請しました。

「いいね!」を押さないと中身が見えないFacebookページが結構あります。どうも「ファンゲート」と言うようです。はい、ここ赤い字のところ、テストにでますよ!

じゃらんの場合
いいね!を押す前


いいね!を押したあと

R25の場合
先ほどの、「ようこそ」画面もありましたが、こちらは、「いいね!」を押すとクーポンを表示するようです。

いいね!を押す前


いいね!を押したあと

さいきん、結構見かけるようになりましたが、実はこのファンゲートは自分でサーバーを用意して、プログラムを組まないと作れないのです。ギャフン!

(昔は出来たんですけど、FBMLが廃止になって自分で鯖用意してIFRAMEしろという自己責任仕様に変更された。)

つまり、ユーザーが「いいね!」を押したかどうか調べるプログラム書かないと行けない上に、お金を出してサーバーを借りたりしないといけないようです。

ぼくらには、大したことでも何でもないのですが、昨今、小さな商店や自治体でもFacebookページを持っているので、そういった方々には敷居が高い気がしました。

そこで、HTMLさえ書ければ誰でも簡単に「いいね!」を押さないと中身が見えないfacebookページを作れるWebサービスを作りました。もちろん一般のWebデザイン屋さんが、これを使ってクライアント様のFacebookページを全く作成してもかまいません。

以下のチュートリアルを見れば分かるようにほとんどクリックするだけです。ファンページ一式70万とか700万とか取ってたソーシャルコンサルとかには申し訳ないんですけど、無駄に手軽にしました。app_keyがどうとかsigned_requestのJSONがどうとかSSL設定とかは、しなくてよくなってます。IFRAMEアプリのっけるために必要な電話認証とかクレカ認証とか面倒臭い手続きが従来あったのですが、こっちのアプリで代行してます。



チュートリアル

すでに、あなたがフェイスブックページを持っているものとします。もってない人はFacebookページ作成画面で適当にクリックすれば、15秒で作れます。

  • ステップ1:ウェルカムファンゲートを追加します。
  • ステップ2:編集する!
  • ステップ3:ユーザーが始めて訪れたときに、Welcomeページが出るようにします。
  • ステップ4:ウェルカムページだけでなく、他のページを追加したいとき!
ステップ1

ウェルカムファンゲートを追加します。
(1)facebookにログイン





(2)ここをクリックするか、「ファンゲーター」で検索!





(3)ファンゲーターのFacebookページです。





(4)[いいね!]を押します。





(5)[ファンゲートページを作る]をクリック!





(6)[あなたのFBページにウェルカムゲートの追加する]をクリック





(7)あなたの持っているファンページの一覧が出てきます。ファンゲートを追加したいページを選んでください。





(8)[Welcome Pageを追加]をクリックします。




(9)あなたのFBページに[Welcome Page]が追加されました。





(10)[Welcome Page]を押してください。





(11)おめでとうございます!デフォルトの猫のウェルカムページが設置出来たこと確認してください。残念ながらデフォルトは猫です。「いいね!」を押すとウォールに飛ばされるケースもありますが、FBの仕様です。じゃらんとかもそうなってます。





ステップ2:

編集する!

(1)あなたのファンページに移動します。





(2)Welcomeページをクリックします。





(3)[このページを編集する]をクリックします。このボタンはページの管理者にしか表示されません。一般ユーザからは見えません。





(4)編集画面になりますので、適当にHTMLを編集してください。画像もアップロードできます。





(5)[保存]を押すと保存します。





(6)[いいね!を押した後のページ]をクリックすると[いいね!]を押した人だけが見れるページを編集できます。





(7)画面左、Welcomeをクリックすると、実際のページが見えます。





(6)[いいね!]を押すと切り替わるのがわかります。





ステップ3:

ユーザーが始めて訪れたときに、Welcomeページが出るようにします。これはfbの設定をいじるだけです。

(1)あなたのFacebookページに移動します。





(2)画面左部[基本データ]をクリックします。





(3)画面右上部[Facebookページを編集]をクリックします。





(4)画面左部「権限の管理」をクリックします。





(5)画面左部[デフォルトで表示するタグ]→[Welcome Page]を選択





(6)画面下部[変更を保存]をクリック。これでデフォルトがウェルカムページになりました。





ステップ4:
ウェルカムページだけでなく、他のページを追加したいとき!先ほどのクーポンなどのパターンです。
(1)編集画面の「さらにページを追加する」を押すだけ!





(2)あなたの持っているファンページの一覧が出てきます。ファンゲートを追加したいページを選んでください。





(3)クリックします。





(4)あなたのFacebookページに[追加情報01]というタブができました。





(5)[追加情報01]をクリック





(6)編集画面になりますので、適当にHTMLを編集してください。





(7)画面左、[追加情報01]をクリックすると、実際のページが見えます。





(8)[追加情報01]では名前がかっこわるいことに気づきます。





(9)画面左部[基本データ]をクリックします。





(10)画面右上[facebookページの編集]をクリックします。





(11)画面左[アプリ]をクリックします。





(12)画面下、追加情報[設定の編集]をクリックします。





(13)名前を変更します。





(14)facebookページに戻ります





(15)[追加情報01]というタグの名前が[秘密のページ]に変更されてます。






長いですけど、チュートリアルは以上です。
FAQ


Q:FacebookとGoogleって仲悪そうだけど、このサービス大丈夫なの?
A:そもそも、GoogleさんもFacebookさんも「Googleのサーバー(GAE)を使ってFacebookアプリを作る公式ガイド」を出しているので大丈夫です。FacebookとGoogle plusはライバルですが、インフラとアプリやfacebookページに関しては、お互いメリットがありまくるので、問題ないです。

Googleの「Googleのサーバーを使ってFacebookアプリなどを作る」公式ガイド:
http://code.google.com/appengine/articles/shelftalkers.html

Facebookが公開してる「GoogleのサーバーでFacebookアプリの作り方ガイド」
https://developers.facebook.com/docs/samples/canvas/


Q:画像の表示がたまに遅い
A:GAEのblobが遅いため。改善策も検討中。どうしても遅い場合は他社のWebサービスかサーバーに画像を上げてください。DropBoxとか


Q:プレミアムプランとはなにか?
A:サポートありで、その他特典あったりします。9月ごろ予定。価格は検討中です。


Q:作ったページを消したい。
A: [基本データ]->Facebookページ編集->アプリ->Welcomeページ右上のXマークです。


Q:キャンペーン応募ページを作りたい。
A:対応します。。


A:マジメに使いたいので問い合わせたい
A:電子メール:info_toiawase(at)crazyworks.jpまで問い合わせてください。

Comment(0)