目次
1.カウントダウンとは
受付できる期間や、購入できる期間をカウントダウン方式で表示し、訪問者に締切がいつまでなのか一目でわかるように表示する仕組みです。このWebページでは黄色い文字で表示されている箇所がカウントダウンが設置されている箇所です。
2.カウントダウンがなぜ必要なのか
カウントダウン＝締切と表現した方がわかりやすいかもしれません。人は難しい判断や決断を先送りにする癖があると言われています。そう言われると、僕も夏休みの宿題は最終日まで全く手を付けないタイプのこどもでした。しかし、8月31日には親に怒られながら必死になって宿題をしていた気がします。
このように、人は締切がないといつまでもズルズルと先延ばししてしまうため、期限を区切ってあげること必要です。個人的には期限を区切ってあげる方が親切なのかもしれないと思っています。
3.カウントダウンを設定するメリット
カウントダウン＝締切を設定する一番のメリットは、先延ばしされ忘れさられるのを防ぐことです。締切のないLPは「どうせいつでも購入できるだろう」「いつでも申込みできるだろう」と思われ、その結果いつまでたっても決断してもらえないからです。
「申込みは○○月○○日○○時迄！」と締切があると、気になっている商品やサービスならそれまでに決断しなければという心理が働きます。さらに、カウントダウンで残り時間が少なくなっていく様子を目にすると、早く決断しないと。と思ってしまうのが人間の心理と言われています。
4.Unbounceにカウントダウンを設定する方法
Unbounceにカウントダウンを設定する方法は2パターンあります。1つは公開されているスクリプトを使い設定する方法です。そしてもう一つは有料ツールを使い設定する方法です。それぞれのメリット、デメリットは下記の通りです。
4-1.無料・有料それぞれのメリットとデメリット
■カウントダウンを無料で設定するメリットとデメリット
【メリット】
1番のメリットは費用が掛からない点です。費用を抑えたい方にはおすすめです。
【デメリット】
HTML等の知識が必要です。下手にソースをいじると上手く機能しなくなる可能性があります。また、知識がないとデザインを変更が難しいです。
■カウントダウンを有料で設定するメリットとデメリット
【メリット】
1番のメリットは誰でも簡単に設定できる点です。また有料ツールを使えばデザインもあらかじめ用意されたテンプレートの中から選ぶことができます。
【デメリット】
有料ツールを利用する場合のデメリットは費用がかかる点です。とはいえ、無料で始められるものあります。（ただし、ブランドロゴが表示される等気になる点もありますが…）
4-2.無料でUnbounceにカウントダウンを設定する方法
管理画面でカウントダウンを設定したいLPを選択し「Edit Champion Variant 」をクリックします。
編集画面が表示されたら左の作業バーから「Text」を選択し、カウントダウンを設置したい場所に配置します。
画像のようにカウントダウンを配置したら「</>View Source」をクリックします。
「</>View Source」をクリックするとソースが表示されるのでこれを下記の内容のソースに変更します。元のソースは全て削除し、下記のソースをコピペしてください。
<p style=”text-align: center;”><span id=”timer” style=”color: rgb(255, 255, 0); font-size: 36px;”><strong><span style=”font-family: Lato; font-weight: 900; font-style: normal;”><strong><strong>00 日 00 時間 00 分 00 秒</strong></strong></span></strong></span></p>
※ソースの変更は自己責任でお願いします
コピペし上記のように書き換えたら「Done」をクリックしてください。
次に編集画面の下にある「Javascripts」をクリックします。
・Script Name：スクリプト名を入力 （管理しやすい名前に変更してください：例 タイマー1）
・Placemet：配置する場所を選択 （「Before Body End Tag」を選択してください）
・Paste or type scripts.<script>tags must be included：下記のスクリプトを入力します。
<script>
countdown(‘10/30/2020 8:00 PM‘, ‘timer’); //date format: mm/dd/yyyy hh:mm AM
function countdown(dt, id)
{
var end = new Date(dt);
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
function showRemaining() {
var now = new Date();
var distance = end – now;
if (distance < 0) {
clearInterval(timer);
document.getElementById(id).innerHTML = ‘受付は終了致しました。‘; //Displays when countdown is complete
return;
}
var days = Math.floor(distance / _day);
var hours = Math.floor((distance % _day) / _hour);
var minutes = Math.floor((distance % _hour) / _minute);
var seconds = Math.floor((distance % _minute) / _second);
document.getElementById(id).innerHTML = days + ‘ 日 ‘;
document.getElementById(id).innerHTML += hours + ‘ 時間 ‘;
document.getElementById(id).innerHTML += minutes + ‘ 分 ‘;
document.getElementById(id).innerHTML += seconds + ‘ 秒’;
}
timer = setInterval(showRemaining, 1000);
}
/**
* Do not remove this section; it allows our team to troubleshoot and track feature adoption.
* TS:0002-03-083
*/
</script>
※期日の設定はスクリプト内の赤文字（10/20/2020 8:00 PM）の箇所を変更してください
※期日を過ぎた後に表示する文字は赤文字（受付は終了致しました。）の箇所を変更してください
スクリプトの入力が完了したら「Done」をクリックして設定完了となります。
4-3.有料ツールを使いUnbounceにカウントダウンを設定する方法
POWRであれば、誰でも簡単にUnbounceにカウントダウンを設定することが可能です。また、こちら無料で使うこともできます。ただし、無料の場合はPOWRブランドのロゴが表記されてしまうので、できる限りアップグレードして使うことをお奨めします。アップグレードしても＄4.99/月～払えば1ヵ月から使うことができるので負担もそれほど大きくはありません。
もう一つ海外では有名なdeadline funnelです。こちらはPOWRよりも利用金額が高くなりますが、多くの機能がついており本格的にカウントダウンを利用したい方にはお薦めです。ただし、Unbounce同様に英語のみ対応なので英語が苦手な方は、POWRを使った方がいいかもしれません。
5.まとめ
カウントダウンを設定することで、その期日までに人を行動させることができます。もし、あなたのLPにまだカウントダウンが設置されていなくて、効果がイマイチであれば、ぜひカウントダウンを設定していみてください。締切を区切ることの効果を実感することができるはずです。
Unbounceの使い方はこちらで説明しています。
