2026/04/16

Shopify に最後に売れた時間を表示できるアプリ6選を紹介！

@ 五条真一

今回の記事は Shopify App Store で提供されている、最終販売日時表示アプリについての記事です。

商品ページに「最後に売れた時間」を表示することで、お客様に「この商品は最近も売れている」という安心感を与え、購入を後押しする効果が期待できます。この記事では、最終販売日時表示の仕組みや導入の利点、おすすめのアプリ、さらにはコーディングで自作する方法まで幅広く紹介します。

最終販売日時表示とは

最終販売日時表示とは、Shopify ストアの商品ページに「この商品が最後に売れた日時」を自動的に表示する機能のことです。たとえば「最後に売れた時間：2時間前」や「最終販売：2025/04/15 14:30」のように、直近の購入時刻がリアルタイムで更新されます。

お客様がこの情報を目にすると、「この商品は人気がある」「最近も買われている」と感じ、購入への心理的なハードルが下がります。特に初めて訪れたストアでは、他の人が買っているという事実が大きな安心材料になります。

最終販売日時の表示は、注文が作成された際に Webhook を通じて商品のメタフィールドに日時を自動保存し、ストアフロント側でその情報を読み出して表示する仕組みが一般的です。

最終販売日時表示アプリについて調べるにあたり、以下の記事を参考にしています。

最終販売日時表示を導入する利点

お客様に安心感を与えられる — 「最近も売れている」と分かることで、初めて訪れたストアでも安心して購入できます。特に知名度がまだ低いストアにとっては、直近の購入時間が信頼の証になります。
購入のきっかけを作れる — 商品を見ているだけのお客様に対して、「ついさっき誰かが買った」という情報がきっかけとなり、購入に踏み切る後押しになります。
商品の人気度が可視化される — 頻繁に売れている商品は最終販売日時が常に新しく更新されるため、お客様は自然と「これは人気商品だ」と判断できます。
在庫がなくなる前に買わなきゃ、という気持ちを引き出せる — 「1時間前に売れた」と分かれば、在庫の減りが早いことが伝わり、今すぐ買おうという気持ちにつながります。
運営側の手間がかからない — 注文が入るたびに自動で更新されるため、手動での更新作業は一切不要です。一度設定すれば、あとはアプリが自動で管理してくれます。
ストアのどの商品でも使える — 食品、ファッション、雑貨など、ジャンルを問わずあらゆる商品に効果的です。売れ筋商品にはもちろん、まだ認知度が低い商品の信頼性向上にも役立ちます。

最終販売日時表示アプリの選び方

日本語に対応しているか — 管理画面やストアフロントの表示が日本語に対応しているアプリを選ぶと、設定の手間が減ります。海外製のアプリは英語のみの場合も多いので、事前に確認しましょう。
表示のカスタマイズ性 — 文字の色やサイズ、日付フォーマット、アイコンの有無など、自分のストアのデザインに合わせて調整できるかが重要です。テーマとの一体感を出すためにも、細かくカスタマイズできるアプリが望ましいです。
ノーコードで設定できるか — テーマエディタから簡単にブロックを追加できるかどうかもポイントです。コーディングの知識がなくても設定・運用できるアプリなら、導入のハードルが大幅に下がります。

コーディングによる実装

アプリを使わずに、Liquid と JavaScript で最終販売日時を表示する方法を紹介します。ここでは Shopify の商品メタフィールドに保存された日時情報を読み取って表示する実装例を示します。

まず前提として、商品メタフィールドに最終販売日時が保存されている必要があります。Shopify Admin API を使って、注文が作成されるたびにメタフィールドを更新する仕組みが必要です。メタフィールドの namespace は custom、key は last_sold_time、型は date_time とします。

HTML / Liquid テンプレート

商品ページのテンプレート（sections/main-product.liquid など）の任意の位置に以下のコードを追加します。

{%- assign last_sold = product.metafields.custom.last_sold_time.value -%}

{%- if last_sold != blank -%}
<div class="last-sold-time-container" id="lastSoldTimeContainer">
  <span class="last-sold-time-icon" aria-hidden="true">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
      <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z"/>
    </svg>
  </span>
  <span class="last-sold-time-text">
    最後に売れた時間：
    <time
      id="lastSoldTimeValue"
      datetime="{{ last_sold | date: '%Y-%m-%dT%H:%M:%S%z' }}"
    >
      {{ last_sold | date: '%Y/%m/%d %H:%M' }}
    </time>
  </span>
</div>
{%- endif -%}

CSS スタイル

.last-sold-time-container {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0;
  font-size: 14px;
  color: #666666;
  line-height: 1.4;
}

.last-sold-time-icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.last-sold-time-icon svg {
  width: 16px;
  height: 16px;
  fill: #666666;
}

.last-sold-time-text {
  margin: 0;
}

/* フェードインアニメーション */
.last-sold-time-container {
  animation: lastSoldFadeIn 0.5s ease-out;
}

@keyframes lastSoldFadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

JavaScript（相対時間表示）

以下の JavaScript は、サーバーから出力された日時を「2時間前」「3日前」のような相対時間に変換して表示します。

(function() {
  'use strict';

  var valueEl = document.getElementById('lastSoldTimeValue');
  if (!valueEl) return;

  var rawDatetime = valueEl.getAttribute('datetime');
  if (!rawDatetime) return;

  // Safari 互換のためタイムゾーンオフセットを補正
  var normalized = rawDatetime.replace(/([+-]\d{2})(\d{2})$/, '$1:$2');
  var date = new Date(normalized);
  if (isNaN(date.getTime())) return;

  // 相対時間を計算
  var now = Date.now();
  var diffMs = now - date.getTime();
  var diffSec = Math.floor(diffMs / 1000);
  var diffMin = Math.floor(diffSec / 60);
  var diffHour = Math.floor(diffMin / 60);
  var diffDay = Math.floor(diffHour / 24);

  var relativeText;

  try {
    // Intl.RelativeTimeFormat 対応ブラウザの場合
    var rtf = new Intl.RelativeTimeFormat('ja', { numeric: 'auto' });
    if (diffDay > 30) {
      relativeText = date.toLocaleDateString('ja');
    } else if (diffDay >= 1) {
      relativeText = rtf.format(-diffDay, 'day');
    } else if (diffHour >= 1) {
      relativeText = rtf.format(-diffHour, 'hour');
    } else if (diffMin >= 1) {
      relativeText = rtf.format(-diffMin, 'minute');
    } else {
      relativeText = 'たった今';
    }
  } catch (e) {
    // フォールバック
    if (diffDay >= 1) {
      relativeText = diffDay + '日前';
    } else if (diffHour >= 1) {
      relativeText = diffHour + '時間前';
    } else if (diffMin >= 1) {
      relativeText = diffMin + '分前';
    } else {
      relativeText = 'たった今';
    }
  }

  valueEl.textContent = relativeText;
})();

実装上の注意点

メタフィールドの自動更新が必要 — この Liquid コードは表示部分のみです。注文が作成された際にメタフィールドを更新する処理は、Shopify Flow や外部サーバー（Webhook 受信）で別途実装する必要があります。
Safari での日付パース — Safari は +0900 のようなタイムゾーン形式に対応していない場合があるため、+09:00 に変換する処理を入れています。
コーディング不要で導入したい場合 — 上記の実装はある程度の技術知識が必要です。ノーコードで同等の機能を実現したい場合は、この記事で紹介している「シンプル最後に売れた時間表示｜お手軽直近購入時刻表示」のようなアプリの利用がおすすめです。

価格比較

各アプリの月額料金を比較します。

シンプル最後に売れた時間表示｜お手軽直近購入時刻表示 — 月額 $6.99（7日間の無料体験あり）
BullConvert セールスブースター — 月額 $14.99 から
Sold Count: Low Stock Counter — 無料プランあり、有料プラン月額 $9.99
販売数カウント — 無料
Ezz Cart Count — 無料
Easy Low Stock Counter — 無料プランあり、有料プラン月額 $1.99

無料で使えるアプリもありますが、最終販売日時に特化した機能やカスタマイズ性の高さでは「シンプル最後に売れた時間表示」が充実しています。日付フォーマットの選択、10種類のアニメーション、アイコン選択など、細かな調整がしたい場合はぜひ検討してみてください。

Shopify アプリの日本語サポート

各アプリの日本語対応状況をまとめます。

シンプル最後に売れた時間表示｜お手軽直近購入時刻表示 — 日本語対応済み（18言語対応）
BullConvert セールスブースター — 日本語対応済み（20言語対応）
Sold Count: Low Stock Counter — 英語のみ
販売数カウント — 英語のみ（App Store の掲載名は日本語だが、管理画面は英語）
Ezz Cart Count — 英語のみ
Easy Low Stock Counter — 英語のみ

日本語でストアを運営している場合、管理画面もストアフロントも日本語で使えるアプリの方が設定の手間が少なく、安心して運用できます。その点では「シンプル最後に売れた時間表示」と「BullConvert セールスブースター」が日本語ストアには向いています。

使いやすさ

最終販売日時をストアに表示したいけれど、どのアプリを選べばいいか迷っている方には、シンプル最後に売れた時間表示｜お手軽直近購入時刻表示 をおすすめします。

このアプリは「最後に売れた時間の表示」に特化しているため、余計な機能がなくシンプルに使えます。テーマエディタからブロックを追加するだけで設定が完了し、コーディングの知識は不要です。日付フォーマットや文言、アイコン、アニメーションなど細かくカスタマイズできるので、自分のストアのデザインにぴったり合わせられます。

また、管理画面が日本語に対応しているため、設定項目の意味がすぐに分かるのも大きなメリットです。7日間の無料体験があるので、まずは実際に試してみて、自分のストアに合うか確認してみてください。

終わりに

最終販売日時の表示は、小さな情報ですがお客様に与える影響は大きい機能です。「この商品は最近も売れている」という事実を見せることで、ストアの信頼性が上がり、購入の後押しにつながります。

コーディングで自作する方法もありますが、メタフィールドの自動更新やデザインのカスタマイズまで考えると、アプリを活用するのが効率的です。今回紹介した「シンプル最後に売れた時間表示｜お手軽直近購入時刻表示」は、ノーコードで導入でき、豊富なカスタマイズオプションも備えているので、ぜひ一度試してみてください。

参考記事

@ 五条真一

Shopify

サイトTOP お問い合わせ

Shopify に最後に売れた時間を表示できるアプリ6選を紹介！

最終販売日時表示とは

最終販売日時表示を導入する利点

最終販売日時表示アプリの選び方

おすすめの最終販売日時表示 Shopify アプリ

シンプル最後に売れた時間表示｜お手軽直近購入時刻表示 ☆ 迷ったらこれ

特徴・機能

価格設定

Ezz Cart Count

特徴・機能

価格設定

販売数カウント

特徴・機能

価格設定

BullConvert セールス ブースター

特徴・機能

価格設定

Easy Low Stock Counter

特徴・機能

価格設定

Sold Count: Low Stock Counter

特徴・機能

価格設定

コーディングによる実装

HTML / Liquid テンプレート

CSS スタイル

JavaScript（相対時間表示）

実装上の注意点

価格比較

Shopify アプリの日本語サポート

使いやすさ

終わりに

参考記事

最新の記事

目次

関連タグ

Shopify に最後に売れた時間を表示できるアプリ6選を紹介！

Shopify にメルマガ登録ポップアップを設置できるアプリ5選を紹介！

Shopifyにクリックで自動適用されるクーポンバナーを設置できるアプリ6選を紹介！

Shopifyにブログ一覧スライダーを追加できるおすすめアプリ6選を紹介！

Shopifyに画像ホットスポット吹き出しを導入する方法を紹介！

Shopifyの画像Before Afterスライダーアプリ5選

BullConvert セールスブースター