ブログ

shopify カウントダウンタイマーを追加する方法

最終更新日: 
shopify カウントダウンタイマーを追加する方法

Eコマースでは、緊急性が商品を動かします。

商品ページやお知らせバーに表示される刻々と進む時計は、買い物客に「後で戻ってくる」「結局買わない」ではなく「今すぐ行動する」ための具体的で説得力のある理由を与えます。

ブラックフライデー向けのShopifyフラッシュセールタイマーを設置する場合も、数量限定商品を発売する場合も、ホリデーキャンペーンを実施する場合も、カウントダウンタイマーは、ストアに追加できるコンバージョン向上ツールの中で最もシンプルかつ効果的なものの1つです。

Shopifyのデフォルトテーマにはカウントダウン用のブロックが標準搭載されていませんが、shopify カウントダウンタイマーを設置する方法は3つあります。

  • Shopify App Storeからサードパーティ製アプリをインストールする
  • 無料のカスタムウィジェットを埋め込む
  • プレミアムテーマにアップグレードする

どの方法でも目的は達成できます。どれが最適かは、かけられる予算と、ストアフロントをどこまで軽量に保ちたいかによって変わります。この記事では、3つの方法すべてについて、手順を順を追って解説するとともに、どの方法があなたに最適かをご紹介します。

方法1:Shopify App Storeの拡張機能をインストールしてshopify カウントダウンタイマーを設置する

Shopifyで販売している多くの事業者は、タイマーを追加したいと思ったとき、まずShopify App Storeを探します。Hextom Countdown Timer BarやEssential Countdown Timer Barなどのアプリが人気です。どちらもノーコードで手早く設定でき、開発者の手を借りる必要もありません。

ただし、コストとパフォーマンスの面ではトレードオフがあります。

ほとんどのアプリには無料プランがありますが、表示回数の上限を増やしたり、機能を追加したり、複数のタイマーを使ったりするには、有料プランへのアップグレードが必要になる場合があります。その費用は平均して月額5〜15ドル程度の追加になります。たとえば、Hextomの有料プランは月額9.99ドルから、Essential Countdownのプランは月額6.99ドルからです。

また、複数のサードパーティ製アプリを重ねて導入すると、Shopifyストアの表示速度が低下する最も確実な原因の1つになります。ストアフロントが遅くなればコンバージョン率も下がります。これは、タイマーに期待される効果とは正反対です。

アプリを使った設置方法

  1. Shopify App Storeにアクセスし、カウントダウンタイマーアプリを検索します。
  2. インストールをクリックし、画面の指示に従ってストアに接続します。
  3. GSC Countdown Timer BarアプリのShopify App Storeページ
  1. アプリのダッシュボードからウィジェットを作成を選択し、タイマーの種類と終了日、表示ページ、デザインなどの設定を行います。準備ができたら、右側のボタンをオンに切り替えます。
  2. 有効化トグルが強調表示されたカウントダウンタイマーウィジェットのダッシュボード

方法2:無料の埋め込み型カウントダウンウィジェットでshopify カウントダウンタイマーを追加する(おすすめ)

月額料金を支払ったりストアの表示速度を落としたりすることなく、Shopifyの商品ページに緊急性を演出したいなら、無料のHTML埋め込みがおすすめです。ストアフロントを軽量に保てるうえ、利益率も守れて、デザインを自由にコントロールできます。

Jotformのカウントダウンタイマーウィジェットは、まさにそのための機能です。サブスクリプション不要でご利用いただける無料のウェブサイト用ウィジェットのコレクションの1つです。

設定パネルとライブプレビューを備えたJotformのカウントダウンタイマーウィジェットビルダー

色、フォント、レイアウトをブランドに合わせてカスタマイズし、あらゆるShopifyテーマエディタに標準搭載されているカスタムLiquidブロックまたはカスタムHTMLブロックを使って、カウントダウンをShopifyに埋め込めます。

サイトを重くせず、継続的なコストも発生しない、信頼性の高い無料のshopify カウントダウンタイマーを求める事業者の方に、この方法をおすすめします。

設置方法

  1. Jotformのカウントダウンタイマーウィジェットのページにアクセスして、タイマーをカスタマイズします。目標の日時を設定し、色を選んで、デザインをプレビューします(デスクトップとモバイルの両方でプレビューできます)。続行をクリックして、レイアウト設定を選択します。プレビューに満足したら、ウェブサイトで無料で試すをクリックし、埋め込みコードをコピーします。
  2. 設定とタイマーのライブプレビューが表示されたJotformのカウントダウンタイマーウィジェットエディタ
  1. Shopifyアカウントでオンラインストアに移動し、テーマを編集をクリックして、タイマーを表示したいページを開きます。タイマーを表示したいセクションにカスタムLiquidブロックまたはカスタムHTMLブロックを追加します。たとえば、商品ページのカートに追加ボタンの上や、お知らせバーなどがおすすめです。
  2. カスタムLiquidを使ってJotformのカウントダウンタイマーを埋め込んだShopifyテーマエディタ
  1. 埋め込みコードをブロックに貼り付けて、保存をクリックします。これで完了です。カスタムHTMLのカウントダウンがShopifyで公開され、時を刻み始めます!

Pro Tip

Jotformのカウントダウンタイマーウィジェットは、商品ページ、ホームページ、キャンペーン専用のランディングページなど、ストア内のどのページでも使えます。まずはアクセス数が最も多い商品ページのファーストビューに配置し、そこから徐々に広げていくのがおすすめです。

方法3:プレミアムShopifyテーマにアップグレードしてshopify カウントダウンタイマーを表示する

サードパーティ製の埋め込みを使うよりも、テーマに機能を直接組み込みたいという事業者もいます。Shopifyテーマストアの有料テーマの多くには、テーマエディタにカウントダウンタイマーのセクションが用意されており、追加のツールなしですぐに設定できます。

ストア全体のリニューアルをすでに計画している場合(またはカウントダウンタイマーのセクションを含むプレミアムテーマをすでにお持ちの場合)には、この方法が適しています。ただし、必要な機能がタイマーだけであれば、無料でも導入できる1つの要素のためにプレミアムテーマを購入するのは、大きな出費になりかねません(プレミアムテーマの価格は平均で100ドルから350ドル以上で、買い切り型の料金です)。

プレミアムShopifyテーマでタイマーを有効にする方法

  1. Shopifyアカウントでオンラインストアに移動し、テーマストアを見るをクリックして有料テーマを探します。機能の項目でカウントダウンタイマーを絞り込み条件に選択するか、機能一覧にカウントダウンタイマーが記載されているテーマを検索します。
  2. 機能フィルターで「カウントダウンタイマー」が選択されたShopifyテーマストアのページ
  1. 選んだテーマを購入してインストールしたら、テーマを編集をクリックしてテーマエディタを開きます。カウントダウンのセクションを探します。通常はサイドバーに独立したセクションとして表示されており、任意のページテンプレートにドラッグして配置できます。
  2. 終了日時を設定し、表示するテキストを更新したら、保存して公開します。

無料のノーコードウィジェットでShopifyストアを強化する

ストアに機能を追加するたびに月額のサブスクリプション料金が発生すると、あっという間に深刻なコスト負担になりかねません。とくに、すでに利益率がぎりぎりのドロップシッピング事業者や小規模な事業者にとっては大きな問題です。

Jotformのカウントダウンウィジェットなら、実績のある緊急性演出ツールを無料で利用でき、継続的な料金もストアフロントのパフォーマンス低下も発生しません。shopify カウントダウンタイマーを手軽に導入したい方に最適です。

とはいえ、カウントダウンウィジェットは、さらに充実したツールキットのほんの一部にすぎません。無料のJotformウェブサイト用ウィジェットのディレクトリには、SNSフィード、カスタマーレビュー、フォームなど、さまざまな要素をストアフロントにすばやく追加できる150以上のウィジェットが揃っています。

Shopifyストアでぜひ活用したいウィジェットを、いくつかご紹介します。

  • バナーウィジェット:プロモーション、セール、季節限定キャンペーン向けにカスタマイズ可能なお知らせバーを、ストアのコンテンツの真上に追加できます。
  • レビューウィジェット:Google、Facebook、Etsy、eBayなどからお客様の声を取り込めます。
  • Eコマースウィジェット:商品の表示、価格設定、プロモーション、コンバージョン向上に役立つその他のツールについては、Eコマースカテゴリ全体をご覧ください。

これらのウィジェットはすべて、カウントダウンタイマーウィジェットと同じ手順で埋め込めます。コードをコピーして、カスタムHTMLブロックに貼り付けるだけで完了です。

ほかにも無料でストアに追加できるものを確認するには、Jotformウェブサイト用ウィジェットのディレクトリをご覧ください。

この記事は、フラッシュセール、商品の新発売、ホリデーキャンペーンで緊急性を演出したいと考えている、Shopifyを利用するEコマースストアのオーナー、ドロップシッピング事業者、マーケターの方に向けた内容です。月額のアプリ料金は必要ありません。

コメントの送信:

Jotform Avatar
このサイトは reCAPTCHA によって保護されており、Googleのプライバシーポリシーと利用規約が適用されます。

Podo Comment 最初のコメントを投稿してください。