今回はClickFunnelsでFacebookコメント機能を実装していきます。
今回お届けするノウハウはこちら
Facebookコメント機能のメリット
Facebookコメント機能はウェビナーの下のほうのFacebookコメントを自分も見たり投稿できるようにする機能です。これはサンプルなので英語圏のコメントが9600ほどたまっているのですが、これをご自身のページに貼り付けてURLを適切に設定していけば、ご自身のページに入ったコメントだけを見ていくことができるのでけっこうお勧めです。ライブローンチなどでもすごく役立つと思います。
Step1. 「FB COMMENTS」を挿入する
今回はビデオのすぐ下にFacebookコメントを付けます。「ADD NEW ELEMENT」をクリックして「FB COMMENTS」を選択します。
Step2. SETTINGSタブを設定する
- TOP MARGIN：エレメントの上の余白を調整できます。
- COMMENT URL：一番肝になるのは「COMMENT URL」です。今は「http://example.com」というURLが入っているのですが、これはご自身のClickFunnelsのページ自体のURLを持ってきてください。代表URLやバリエーションのURLなど、ClickFunnelsはいろいろとURLが分かれていたりするので、どのURLを持ってくるかという話になると思いますが、答えはシンプルです。私たちが代表URLと呼んでいるものなのですが、これをコピーして貼り付けます。ちなみに代表URLを貼り付ける理由は、後ほど「CREATE VARIATION」でバリエーションをもう一つ作ってABテストをしたりするので、そういうときに代表URLにしておけばAとBの両方にコメントが反映されるからです。例えばAに付いたコメントはBでも見ることができ、Bに付いたコメントはAでも見ることができるという感じで、AとBが分岐していかないというか、ばらばらにコメントがたまっていくということがなくなり、1箇所で管理できるのでお勧めです。
- # OF POSTS：コメントがたくさん付いたときに何個まで表示するかを設定できます。これはいくつか普通に変えられるので「10」などに設定してもいいと思います。
- COLOR THEME：色合いを変えることができるので、「Light」か「Dark」の好きなほうを選んでください。
Step3. ADVANCEDタブを設定する
まずはSTYLESタブです。「STYLES」に関しては特に設定項目がありません。
ADVANCEDタブのANIMATIONタブはいつも説明しているとおり他のエレメントと共通していて、ディレイの表示に関する設定ができます。上と下で大きく分かれています。
- 上のほうは1秒以上の比較的長めのディレイを入れることができます。
- 下のほうはJavaScriptでいうLazy Loadingのような感じで、ミリセカンド単位のより短いディレイを入れることができます。
これは上のほうがメインで使っていくことが多いかもしれません。例えば60分のウェビナーが始まって5分ぐらいのところでFacebookコメントを出したいという場合は「TIMED DELAY」で効果を選択できます。「Fade In」か「Fade In With Scale」のどちらか好きなほうを選んでください。
「MINUTES」と「SECONDS」に関しては、例えば「5分13秒あたりで“コメントをください”と言っているからここがいいかな」と思って5分13秒に設定したとすると、厳密には動画が始まってからではなくてページを読み込んでから5分13秒になるのですが、ほぼ自動再生などのタイミングと合うと思うので、その辺は緩く管理していただきたいと思います。この場合は5分13秒後にFacebookコメントのエレメントが出てくるという感じになります。
下の「ANIMATION」のほうは「TYPE」が2種類あります。上のほうはページの読み込みを起算点としているのですが、下のほうのミリセカンド単位の細かいディレイの場合は、ページの読み込みを起算点とする「On Page Load」と、長いページなどでスクロールしていって表示するエレメントの場所まで来た時点を起算点とする「On Page Scroll (becomes visible)」があります。
「On Page Load」も「STYLE」をいろいろ選択できるので試してみてください。「DELAY (MS)」はミリセカンド単位で、デフォルトでは500ミリセカンドになっています。これも好みで調整してみてください。「On Page Scroll (becomes visible)」も先ほど説明したとおりで、「STYLE」も「DELAY (MS)」も設定項目自体は一緒です。どちらを起算点とするかでいろいろ試しながら、ご自身のページに合う設定を行ってください。
ということで、うまくいくとこのようなFacebookコメントのエレメントが出てくると思います。最初のうちはコメントがなかったらコメントをポストする窓だけが出てくると思うのですが、いろいろ試してみてください。今回は以上です。
