Facebook Fangateファンゲート試作　~ベール表現法

facebook300x300 FacebookページのFangate　ファンゲート機能

Facebookページで、「いいね！」をクリックされる前と、クリックされた後で表示内容を切り替えることができるものです。

ファンゲート機能を使えば、単にFacebookページを作って、「いいね」がクリックされるのを待つというのではなく、Facebookページのファンになってくれた人にだけにコンテンツを見せたり、特典を提示したりと積極的にファンを増やしていくことができます。

まだまだ大手の会社のサイトなどでも、FacebookページはあってもFangateファンゲートを設置しているページはまだそれほど多くはないようですが、今後はますます増えていくのでしょうね。

そこで、私もFacebookの勉強のついでに、このFangateファンゲート対応のFacebookページを作ってみることにしました。

とくに私が作りたいと思ったのが、こちら大手飲料メーカ　RedBull のようなページ　　リンク

いいねをクリックする前は、ページにベールがかかり、下にある動画コンテンツを見るには、いいねをクリックしなくてはならない　といった仕掛けになっています。

いいねをクリックする前とクリックした後で、全く異なるページを見せるというのではなく、同じページにベールを被せ、下にあるページのコンテンツをうっすらと表示して見せることで、ページ訪問者の見てみたいという心理をくすぐります。

うまい仕掛けですね。

では、このようなFangate機能をもつページを作成するにはどうしたらよいでしょうか。

調べてみたところ、うぇぶこん様のサイトやKACHIBITO.net様のサイトの記述が参考になりました。

いいねが押されたかどうかで、phpを使って条件分岐し、表示内容を切り替えています。

今回の場合、基本的は同じページを表示し、但しいいねが押される前では追加でベールをかけるようになっています。

こちらが私が作ったページの試作です。

ページはまだ製作途中のため非公開にしていますので、実際に動いている様子を見ていただくことができませんが、ここではいいねがクリックされる前と後での表示をキャプチャーしたものを貼っておきます。

サムネイルをクリックすると拡大表示します。（一部ボカシが入っています）

Facebookページでは、スライドショーを表示させているので、ベールの上からもうっすらとスライドショーが切り替わっているのがわかります。

下で何かが動いていると、余計に見てみたいという気持ちをかき立てるので、いいねをクリックされる機会が高まるのではと思います。

いいね！がクリックされる前

いいね！がクリックされた後

BLOG - 徒然なるままに