Shopifyの商品ページで残り時間を表示できるカウントダウンタイマーアプリについて徹底解説｜ご利用ガイド
はじめに
今回の記事は、Shopify アプリである「シンプルカウントダウンタイマー｜お手軽残り時間表示」の解説記事です。
Shopify とは、ざっくり説明すると EC サイトを簡単に構築することができるプラットフォームであり、Shopify アプリとはそのプラットフォームの拡張機能のようなものです。WordPress の拡張機能のようなもの、とご認識頂いて大丈夫です。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」は、シンプルですぐに導入できるカウントダウンタイマーアプリです。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」を利用すれば、商品ページに残り時間を表示し、顧客の購買意欲を促進することができます。
ご興味のある方は、以下の URL からインストールしてみてください。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」でできること
Shopify アプリである、「シンプルカウントダウンタイマー｜お手軽残り時間表示」は以下のように、商品ごとにカウントダウンを設定できるアプリです。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」を使えば、商品ごとにカウントダウンを設定できます。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」は、2 ステップで簡単に設定することができます。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」では、カウントダウンテキストの文言を自由に変更できます。
「シンプルカウントダウンタイマー｜お手軽残り時間表示」では、カウントダウンテキストのスタイルを自由にカスタマイズできます。
アプリのインストール
それでは、実際にアプリのインストールを行っていきましょう。
ストア管理画面左下の「設定」をクリックします。
ストアの管理画面の「アプリと販売チャネル」画面に表示されている「Shopify App Store」をクリックして、Shopify App Store に移動してください。
検索窓に、「シンプルカウントダウンタイマー｜お手軽残り時間表示」と入力してください。
以下の画像のアプリをクリックしてください。
「インストール」ボタンをクリックして、ストアにアプリを追加しましょう。マーチャント用のアカウント（実際に物販などで運用しているアカウント）ですと、月額 $6.99 でご利用いただけます。インストール後、7 日間は無料でご利用いただけます。
「インストール」ボタンをクリックすると以下の画面に遷移します。右下の「インストール」ボタンをクリックして、アプリのインストールを行いましょう。
以下の管理画面が表示されます。
アプリをテーマに追加
アプリをテーマに追加します。
自動でアプリをテーマに追加
管理画面の「設定」ページの「テーマにカウントダウンブロックを追加」セクションでアプリをテーマに追加します。
追加したいテーマを選択し、「テーマに追加」ボタンをクリックしてください。
これでテーマにアプリを追加できます。
忘れないように、右上の「保存する」ボタンをクリックしてください。
手動でアプリをテーマに追加
何らかのエラーでアプリを自動追加できない場合は、こちらの手順に従って手動でアプリを追加してください。
管理画面の「設定」ページの「テーマにカウントダウンブロックを追加」セクションから行います。
「テーマをプレビュー」ボタンをクリックしてください。
以下のように商品ページに移動します。
以下の画像の左側にある「テンプレート」内の「ブロックを追加」をクリックします。
表示されるモーダルの中の「アプリ」をクリックし、「シンプルカウントダウンタイマー｜お手軽残り時間表示」をクリックします。
以上で「シンプルカウントダウンタイマー｜お手軽残り時間表示」のアプリブロックを追加できました。忘れないように「保存する」ボタンをクリックしてください。
アプリ設定
アプリのインストールが完了したら、アプリの設定を行いましょう。
カウントダウンタイマー商品設定を追加する
カウントダウンタイマー商品ページへ遷移し、「カウントダウンタイマー商品を追加」をクリックしてください。
以下の画面に遷移します。
カウントダウン表示を行う商品は、「任意の商品」から 1 つずつ選択したり、「コレクション」からまとめて選択したりできます。
今回は「任意の商品」での設定方法を解説します。
「任意の商品」を選択し、商品検索欄をクリックしてください。
すると商品検索画面が開くので、商品を選択し、右下の「完了」をクリックしてください。
以下のように表示されていれば選択完了です。
次に、上記商品の商品ページで表示するカウントダウンの終了日時を設定していきます。
カウントダウン終了日 の入力欄をクリックして、表示されるカレンダーから終了日を選択します。
次に、カウントダウン終了時刻 の入力欄をクリックして、表示される時刻から任意のものを選択します。
選択肢以外の時刻で設定する場合、HH:MM の形で入力欄に直接入力することも可能です。
以上の内容を確認して問題なければ、右下の「設定を保存する」をクリックします。
すると、カウントダウンタイマー商品ページへ遷移し、設定したカウントダウンタイマー商品設定が表示されていることが確認できます。
以上で、カウントダウンタイマー商品の設定が完了です。
カウントダウンタイマー商品設定の編集・削除
カウントダウンタイマー商品ページ で編集したい商品を選択して、「カウントダウンタイマー商品設定を編集」をクリックしてください。
以下のような編集画面に遷移するので、必要な編集を行い、右下の「設定を保存する」をクリックしてください。
カウントダウンタイマー商品設定を削除する場合は、カウントダウンタイマー商品ページ で削除したい設定を選択し、「カウントダウンタイマー商品設定を削除」をクリックします。
すると、以下のような確認画面が表示されるので、問題なければ「削除する」をクリックしてください。
見た目のカスタマイズ
「シンプルカウントダウンタイマー｜お手軽残り時間表示」では、使用しているテーマに合わせて見た目をカスタマイズできます。
まず、カスタマイズ画面の商品ページに移動し、サイドバーのテンプレート内にある「シンプルカウントダウンタイマー｜お手軽残り時間表示」をクリックして、カスタマイズ項目を表示しましょう。
以下の項目からカスタマイズを行うことが可能です。
また、CSS の知識をお持ち場合、以下の「追加の CSS」の項目より、さらなるカスタマイズを行うことが可能です。
おわりに
今回は、「シンプルカウントダウンタイマー｜お手軽残り時間表示」の解説を行いました。
少しでもご興味があれば、以下のリンクよりアプリをインストール頂けるとありがたいです。
ここまでお付き合い頂き、誠にありがとうございました。
.png?w=400){kind=icon}
.png?w=400){kind=icon}
.png?w=400){kind=icon}
.png?w=400){kind=icon}
.png?w=400){kind=icon}
.png?w=400){kind=icon}
