今回はClickFunnelsでSNSのソーシャルシェアボタンを追加していきます。ページを FacebookやTwitterでシェアしてもらうためのボタンです。
Step1. 「SOCIAL SHARE」を追加する
「ADD NEW ELEMENT」をクリックして、今回は一番下のほうにある「SOCIAL SHARE」を選択します。そうすると早速FacebookとTwitterのボタンが出てくるので、設定していきます。
- TOP MARGIN：エレメントの上の余白を調整する所です。
- SHARE URL：デフォルトではちょうど今見ているページが入っています。
- TWITTER TITLE：ブラウザのタブなどに表示される「SEO META DATA」に入っているページのタイトルと同じものが入っています。変更があれば変更してください。
- TWITTER USERNAME：ツイートしてもらうときにページ作成者のTwitterアカウントの名前も一緒にツイートされるので、これは入れておいてもいいと思います。
Step2. THEMESタブを設定する
THEMESタブにはプリセットがいろいろあるので、デザインをご自身のサイズに合わせてやっていただくといいと思います。今回は少し大きめのものにしておきます。
Step3. ADVANCEDタブを設定する
次はADVANCEDタブです。「ALIGN」は「Left」「Center」「Right」と場所を変えられます。
ANIMATIONタブに関しては他のエレメントとほぼ一緒ですが、ページを読み込まれてからディレイを何分かおいて「Fade In」や「Fade In With Scale」でエレメントを表示するというものです。例えばウェビナーページを見ていて、ウェビナーが始まってから30分たったときにエレメントを出したいという場合は、「MINUTES」を「30」にすると30分後にエレメントが出てきます。この30分というのは、ここではページのロードから30分ということです。ウェビナーの再生ボタンをクリックしてから30分というわけではないので、そこだけ注意してください。
下の「ANIMATION」はJavaScriptでいうLazy Loadingのような考え方で、ミリセカンド単位のディレイを指定できます。「On Page Load」と「On Page Scroll (becomes visible)」の2つがあり、ページのロードを起算点とするかスクロールでこのエレメントが見えた時点を起算点とするかで変わってきます。
効果は「STYLE」で選択できます。いろいろな効果があるので試してみてください。
「DELAY」はミリセカンドです。デフォルトではだいたい500ミリセカンドが入っているので、それでやってみてください。今回は以上です。