日付までカウントダウンする
セールの終了、発売、予約受付の締め切りなど、固定された1つの期限までカウントダウンするタイマーを作成します。
Countdown to a date はデフォルトのTime typeで、ほとんどのキャンペーンで使われています。すべてのお客様に同じタイマーが表示され、設定した1つの時点までカウントダウンします。その時点を過ぎると、ゼロになったときに指定した動作が実行されます。
実際に終了するセール、実際に発売する商品、実際に守る配送の締め切りに使用します。
-
カウントダウンを作成する
Section titled “カウントダウンを作成する”アプリを開き、ダッシュボードまたは Countdowns ページから Create countdown をクリックします。
-
Countdown timer テンプレートを選ぶ
Section titled “Countdown timer テンプレートを選ぶ”Countdown templates ページで、タイプのタブを Countdown timer のままにしてデザインを選び、Select をクリックします。用途で絞り込みたい場合は、テンプレートを選ぶをご覧ください。
-
名前を付ける
Section titled “名前を付ける”ビルダーの上部でカウントダウンに名前を付けます。たとえば「Spring sale, ends 31 Mar」のようにします。表示されるのは自分だけです。
-
テキストを入力する
Section titled “テキストを入力する”Settings タブで Content を開き、Title、Subtitle、4つのタイマーラベルを入力します。詳細はタイマーのテキストとボタンをご覧ください。
-
Countdown to a date を選ぶ
Section titled “Countdown to a date を選ぶ”Setting timer セクションを開き、Time type を Countdown to a date に設定します。アプリでは「Timer ends on a specific date.」と説明されており、新しいタイマーでは最初から選択されています。
Countdown to a dateはデフォルトのTime typeです。
-
End date を設定する
Section titled “End date を設定する”Date between の End に、キャンペーンが終了する日時を設定します。これが、タイマーが秒単位でカウントダウンする時点です。
Endは期限です。Startは任意です。
-
Start date を設定するか、空のままにする
Section titled “Start date を設定するか、空のままにする”Start を空のままにすると、保存した時点からタイマーが有効になります。
Start を設定すると、その時点になるまでタイマーは非表示で、時刻になると自動で表示されます。これを使えば、セールを事前にスケジュールできます。今日作成し、金曜の朝に開始するよう設定し、Activeで保存すれば、あとは任せておけます。
-
ゼロになったときの動作を選ぶ
Section titled “ゼロになったときの動作を選ぶ”When countdown timer end を、Do nothing、Hide countdown block、Repeat the timer のいずれかに設定します。実際の期限の場合は、通常 Hide countdown block が適しています。タイマーが終了したときをご覧ください。
-
Design タブでスタイルを設定する
Section titled “Design タブでスタイルを設定する”Design に切り替えて、色、フォント、背景、枠線、余白を変更します。テンプレートの見た目のままにする場合は、この手順を省略できます。カウントダウンをデザインするをご覧ください。
-
表示場所を選ぶ
Section titled “表示場所を選ぶ”Display タブの Show countdown on で Product page にチェックを入れると、商品ページに自動で配置されます。特定の場所に配置したい場合は、Shortcode をコピーします。
その上にある Conditions セクションで、特定の商品、コレクション、ページ、顧客、言語、国にタイマーを限定できます。表示条件をご覧ください。
-
Active で保存する
Section titled “Active で保存する”ステータスを Active に設定し、Save をクリックします。Draft は保存されますが、表示されません。
-
ストアフロントで確認する
Section titled “ストアフロントで確認する”公開中のストアフロントで、カウントダウンの条件に一致するページを開きます。タイマーが表示され、動いているはずです。Start dateがまだ来ていない場合は、何も表示されないのが正しい動作です。
期限の読み取り方
Section titled “期限の読み取り方”残り時間は、設定したEnd dateとお客様のデバイスの時計をお客様のブラウザ上で比較して計算されます。タイムゾーンの設定は別にありません。入力したEnd dateが、アプリがカウントダウンする期限となります。
実際には、次のようになります。
- 他のタイムゾーンのお客様には、同じ時点がそのお客様自身の残り時間として表示されます。これが望ましい動作です。
- デバイスの時計が大きくずれているお客様には、誤ったタイマーが表示されます。アプリで対処することはできませんが、まれなケースです。
実行中のセールを延長または短縮する
Section titled “実行中のセールを延長または短縮する”End の日時を変更して保存します。すべてのお客様のタイマーは、次にページを読み込んだときに新しい期限が反映されます。カウントダウンを作り直す必要はありません。
ビルダー全体を開かずに、Countdowns一覧から変更することもできます。