今回はClickFunnelsでページにQ&Aを作っていきます。
FAQのエレメントを使う
このセールスページにはすでにQ&Aがあるのですが、テキストのエレメントで作っています。ClickFunnelsにはけっこう便利なエレメントがたくさんあるのですが、テキストのエレメントなどで作ってしまいがちです。こういうテキストで作ってしまったものに対してFAQのエレメントで入れ替えていきます。

Step1. 「FAQ」を挿入する
「ADD NEW ELEMENT」をクリックして下のほうにある「FAQ」を選択します。挿入されたらこれを載せ替えていきます。「返金保証はありますか?」の部分は「Q」を抜いて入れ、「A」の部分はそのまま入れます。


Step2. SETTINGSタブを設定する
- TOP MARGIN:他のエレメントと同様に、エレメントの上の余白を調整できます。
- FONT FAMILY:フォントを選択できます。
- QUESTION SIZE:上のヘッダーの「Q」の部分の大きさを変更できます。少し目立つ感じに大きくしてみます。

- TEXT SIZE:元のテキストサイズに合わせてバランスをとってみます。
- QUESTION COLOR:変更できるので、濃い青色にします。
- ANSWER COLOR:変えてもいいのですが、あまり変えると色合いが良くないのでデフォルトに戻しておきます。
Step3. ADVANCEDタブを設定する
次はADVANCEDタブです。
「STYLES」のタブは特に調整できるものがないようです。一瞬バグっぽく見えますが、ちゃんと動いているので問題ありません。

ANIMATIONタブはいろいろなエレメントで説明してきましたが、エレメントを表示する際のディレイを仕込むことができます。上のほうは1秒以上の大きいディレイです。下のほうはJavaScriptでいうLazy Loadingのような感じで、ミリセカンド単位のディレイを仕込むことができます。
「TIMED DELAY」はどういう効果で表示するかが選択できます。「Fade In」と「Fade In With Scale」があるのですが、どちらでもいいと思います。いろいろと試してみてください。
「MINUTES」と「SECONDS」は時間差の設定ができます。例えばよく使うのがウェビナーの途中でセールスを入れたい場合です。1時間のウェビナーに対して30分たってからセールスを挟みたいというときは、30分たつ前にこういうものが表示されていると嫌なので、例えば「MINUTES」を「30」、「SECONDS」を「45」にすると30分45秒に設定することができます。これはエレメント単位ではなくてSectionやRowなどのもっと大きい単位で設定したほうが使いやすいという感じがします。
下の「ANIMATION」は細かいほうのディレイです。「On Page Load」と「On Page Scroll (becomes visible)」の2種類があります。
「On Page Load」はページを読み込んでから指定したミリセカンドで選択した効果が出せます。「DELAY」がミリセカンドになっていて、1000ミリセカンドが1秒なので500ミリセカンドは0.5秒です。この場合はページを表示してから0.5秒たってふわっと出てくるようなイメージです。
「On Page Scroll (becomes visible)」はページのローディングではなくて、例えばエレメントがページの一番下にある場合、そこまでスクロールしていってエレメントの場所に到達した時点から起算して、500ミリセカンドでディレイして出してくれるというものです。
ということで、この後FAQのエレメントを使って全部きれいに入れ替えていこうと思います。やはりFAQのエレメントを使ったほうが見やすいと思います。今回は以上です。