Shopifyで売り切れ商品に入荷予定日を表示できるアプリについて徹底解説｜ご利用ガイド

株式会社UnReact

2026/09/23

はじめに — Shopify の売り切れ商品ページに、店が知っている入荷予定日を出す

Shopify（ショッピファイ）は、世界 175 か国以上で使われているネットショップ作成サービスです。Shopify アプリは、その Shopify のストアに機能を後付けするための拡張機能で、Shopify App Store からインストールして使います。

「シンプル再入荷日表示｜入荷予定日・在庫復活日告知」（英語名: UR: Restock＆Back in Stock Date）は、売り切れた商品のページに「2026年10月10日入荷予定」のような 入荷予定日 を表示する Shopify アプリです。

売り切れた商品のページには、標準では「売り切れ」としか出ません。買い手は「もう入荷しないのか、待てば買えるのか」が分からず、そのまま離脱してしまいます。一方で、店は仕入れ先から「10 日に入荷する」と聞いていることが多いのに、それを商品ページに出す手段がありません。このアプリは、店が知っている入荷予定日をそのまま買い手に見せられるようにします。

管理画面で商品を選び、日付を入れるだけで商品ページに表示されます
複数の商品に同じ日付をまとめて設定できます
入荷日が決まっていない商品は「入荷時期未定」として表示できます
「在庫切れのときだけ表示」か「常に表示」かを選べます
日付の並び順・文言・色・余白などはテーマエディタで調整できます
管理画面もストアフロントの表示も 20 言語に対応しています

料金は 月額 3.99 ドル（年額プランは 39.99 ドルで、2 か月分お得です）。インストールから 7 日間は無料 でお試しいただけます。

アプリストア: https://apps.shopify.com/partners/unreact5?locale=ja

シンプル再入荷日表示のメイン画像。スマホの商品ページに「2027年4月15日入荷予定」が表示されている

「シンプル再入荷日表示」でできること

主な特徴は次の 5 つです。

管理画面から商品ごとに入荷予定日を設定できます
複数の商品にまとめて同じ日付を一括で設定できます
商品を「入荷時期未定」として表示できます
売り切れ時のみ、または常に商品ページに表示できます
1 クリックで簡単にテーマへ追加できます

売り切れ商品ページへの入荷予定日の表示

商品ページの購入ボタンの下などに、カレンダーのアイコン付きで「2027年4月15日入荷予定」と表示されます。表示する位置はテーマエディタでブロックを動かして自由に決められます。日付の表記は買い手の言語に合わせて自動で変わり、英語のお客様には「Restocking on 4/15/2027」、ドイツ語のお客様には「Wieder verfügbar am 15.4.2027」のように出ます。

売り切れ商品ページに「2027年4月15日入荷予定」が表示されている

複数商品への一括設定

管理画面の商品一覧でチェックを付けた商品すべてに、同じ入荷予定日をまとめて設定できます。同じ便で入荷する商品が何十点あっても、1 回の保存で済みます。

管理画面で 3 商品を選び、入荷予定日 2027/06/30 をまとめて設定している

「入荷時期未定」の表示

入荷日がまだ決まっていない商品は、「入荷時期未定」として表示できます。日付を入れた商品でも、その日を過ぎると買い手の画面では自動的に「入荷時期未定」に切り替わります。

管理画面で「入荷時期未定にする」を選んでいる

テーマエディタでの見た目の調整

表示する条件、日付の並び順と区切り、文言、テキスト配置、アイコン、色、文字の大きさ、余白、追加の CSS を、テーマエディタでプレビューを見ながら調整できます。コードを書く必要はありません。

テーマエディタでブロックの表示設定・文言設定・スタイル設定を調整している

1 クリックでのテーマへの追加

アプリの設定画面でテーマを選んで「テーマに追加」を押すと、商品ページにブロックが追加された状態でテーマエディタが開きます。

アプリの設定画面で「テーマに追加」を押すところ

インストールの手順

Shopify アプリのインストール手順は、どのアプリでも共通です。

Shopify 管理画面の左下にある「設定」を開きます

Shopify 管理画面の左下にある「設定」

「アプリと販売チャネル」を開き、「Shopify App Store」を押します

「アプリと販売チャネル」画面の「Shopify App Store」ボタン

App Store の検索窓に「UR: Restock」と入力して検索します。検索結果に「UR: Restock＆Back in Stock Date」が出ます

アプリの詳細ページで「インストール」を押します。App Store で公開直後は検索結果の下のほうに出ることがあるので、見つからないときはアプリストアのページを直接開いてください

アプリ詳細ページの「インストール」ボタン

アクセス権限の確認画面で「インストール」を押すと、インストールが完了してアプリの管理画面が開きます。このアプリが使う権限は「商品」（入荷予定日を商品に保存するため）と「オンラインストア」（テーマの一覧を出すため）だけです。顧客や注文のデータには一切触れません

「アプリをインストール」の権限確認ダイアログ

最初にやる設定 — 3 ステップで商品ページに出るまで

インストール直後は、商品ページにはまだ何も表示されません。次の 3 つを行うと表示が始まります。

ステップ 1: テーマに表示ブロックを追加する

左のメニューの「設定」を開き、「テーマに入荷予定日の表示を追加」のカードで「テーマを選択」からテーマを選び、「テーマに追加」を押します。公開中のテーマが最初から選ばれているので、通常はそのまま押すだけです。

アプリの設定画面。「テーマに入荷予定日の表示を追加」のカードに「テーマを選択」「テーマに追加」「テーマをプレビュー」がある

押すと新しいタブでテーマエディタが開き、商品ページ（product テンプレート）のメインセクション にブロックが追加された状態になります。位置を調整したら、テーマエディタ右上の「保存」を押してください。ここで保存しないとブロックはテーマに残りません。

自動追加がうまくいかないテーマでは、テーマエディタで商品ページを開き、「ブロックを追加」→「アプリ」タブから「シンプル再入荷日表示｜入荷予定日・在庫復活日告知」を選んで手動で追加できます。

テーマエディタの「ブロックを追加」で「アプリ」タブを開き、シンプル再入荷日表示のブロックを選ぶ画面

ステップ 2: 商品に入荷予定日を入れる

左のメニューの「入荷予定日」を開きます。下の商品一覧で入荷予定日を入れたい商品にチェックを付け、上のフォームで「操作」を「入荷予定日を設定する」のまま、「入荷予定日」に日付を入れて「保存」を押します。

アプリの「入荷予定日」画面。上に注意バナー、真ん中に「選択した商品に設定する」フォーム、下に商品一覧がある

ステップ 3: 商品ページで確認する

売り切れている商品のページを開くと、入荷予定日が表示されます。在庫のある商品には既定では表示されません（表示する条件が「在庫切れのときだけ表示」になっているため）。在庫があっても出したい場合は、後述の「表示する条件」を「常に表示」に変えてください。

売り切れ商品ページに「2027年4月15日入荷予定」が表示されている（PC）

保存してから商品ページに反映されるまで、数十分から数時間かかることがあります（理由は「うまく表示されないときの確認ポイント」で説明します）。すぐに出なくても、設定は保存されています。

管理画面の各画面と設定項目

アプリの管理画面は「入荷予定日」と「設定」の 2 画面です。左のメニューから切り替えます。

「入荷予定日」画面

インストール直後に開く主画面です。上から順に、反映に関する注意バナー、「選択した商品に設定する」フォーム、商品の検索欄、商品一覧が並びます。

反映に関する注意バナー

画面の一番上に「設定した内容が商品ページに反映されるまで、時間がかかることがあります。」というバナーが常に表示されています。これは消せません。商品ページに出るまで遅れることがあるのは Shopify 側の仕組みによるもので、詳しくは後述します。

「選択した商品に設定する」フォーム

下の商品一覧でチェックを付けた商品に対して、まとめて設定を行うフォームです。項目は次のとおりです。

項目	内容
操作	「入荷予定日を設定する」「入荷時期未定にする」「設定を消す」の 3 つから選びます。既定は「入荷予定日を設定する」です
入荷予定日	「操作」が「入荷予定日を設定する」のときだけ表示されます。既定値は今日の日付（日本時間）で、形式は YYYY/MM/DD です
保存	フォームの内容を、チェックを付けた商品すべてに保存します。商品を 1 件も選んでいないと押せません
N件を選択中	今チェックが付いている商品の数です

「入荷予定日」の欄をクリックするとカレンダーが開き、日付をクリックして選べます。キーボードから「2027/03/31」のように直接入力してもかまいません。

入荷予定日の欄をクリックしてカレンダーが開いた状態

日付は YYYY/MM/DD の形式でなければ保存できません。形式が違うと「YYYY/MM/DD形式で入力して下さい」、2027/02/30 のように存在しない日付だと「無効な日付です」と出て保存が止まります。過去の日付も入力自体はできますが、買い手の画面では「入荷時期未定」として表示されます。

商品の検索

商品一覧の上の「商品を検索」欄に語句を入れて「検索」を押すと、商品名にその語句を含む商品だけが一覧に出ます（部分一致です）。入力欄には「商品名で検索」と薄く表示されています。検索語は URL に付くので、ブラウザの「戻る」で検索前の一覧に戻れます。

一致する商品が無いときは「商品がありません」と表示されます。検索語を消してもう一度「検索」を押すと全商品に戻ります。

検索に一致する商品が無いときの「商品がありません」表示

商品一覧

一覧には 1 ページに 50 件ずつ商品が並びます。列は次の 3 つです。

商品一覧。在庫のバッジと、入荷予定日の列に日付・「入荷時期未定」・「—」が並んでいる

列	内容
商品	サムネイルと商品名。画像の無い商品は仮のアイコンが出ます
在庫	在庫の合計が 0 以下なら「在庫切れ」、1 以上なら「在庫あり」のバッジが出ます
入荷予定日	設定した日付（2027-04-15 のような形式）、または「入荷時期未定」のバッジ、何も設定していなければ「—」です

行の左端のチェックボックスで商品を選択します。一番上のチェックボックスを押すと、表示中のページの全商品をまとめて選択できます。選ぶとフォームの「N件を選択中」が増え、「保存」が押せるようになります。

一覧で商品を 1 件チェックし、「1件を選択中」と表示されている

一覧の末尾には「前へ」「次へ」のボタンがあります。商品が 50 件を超えると「次へ」が押せるようになり、次の 50 件に移ります。検索中も同じです。

商品一覧の末尾にある「前へ」「次へ」ボタン

ここで注意したいのは、一覧の「在庫」は Shopify に登録されている在庫数の合計で判定している点です。在庫を追跡していない商品は在庫数が 0 なので一覧では「在庫切れ」と出ますが、ストアフロントでは「購入可能」として扱われます。 そのため表示する条件が「在庫切れのときだけ表示」のままだと、そうした商品には入荷予定日が出ません。出したい場合は「常に表示」にしてください。

入荷予定日を設定する

商品一覧で、日付を入れたい商品にチェックを付けます
「操作」で「入荷予定日を設定する」を選びます（既定で選ばれています）
「入荷予定日」に日付を入れます
「保存」を押します

保存が終わると画面下に「1件の商品に設定しました」のようなトーストが約 10 秒間表示され、一覧の「入荷予定日」列に日付が入ります。

保存後に画面下へ「1件の商品に設定しました」のトーストが出て、一覧に 2027-03-31 が入った状態

同じ商品に前から「入荷時期未定」が付いていた場合、日付を入れると「入荷時期未定」は自動的に外れます。両方が同時に付くことはありません。

入荷時期未定にする

商品にチェックを付けます
「操作」で「入荷時期未定にする」を選びます。「入荷予定日」の欄は消えます
「保存」を押します

一覧の「入荷予定日」列に「入荷時期未定」のバッジが付き、商品ページには「入荷時期未定」と表示されます。前に入れていた日付があれば消えます。

「操作」で「入荷時期未定にする」を選び、日付欄が消えた状態

設定を消す

商品にチェックを付けます
「操作」で「設定を消す」を選びます
「保存」を押します

日付と「入荷時期未定」の両方が消え、一覧は「—」に戻ります。商品ページには何も表示されなくなります。このときのトーストも「1件の商品に設定しました」という文言です（消した件数として読んでください）。

「操作」で「設定を消す」を選んだ状態

設定を消して保存した後。トーストが出て、一覧の入荷予定日が「—」に戻っている

保存の仕組みと件数の上限

保存した内容は、Shopify の商品に「入荷予定日（date 型）」と「入荷時期未定（boolean 型）」のメタフィールドとして記録されます。アプリをアンインストールしてもデータはすぐには消えず、再インストールすると同じ値が一覧に出ます。

このメタフィールドは Shopify 標準の商品編集画面には表示されず、編集もできません。入荷予定日の入力はこのアプリからだけ行う設計です。

一度に選ぶ商品の数に上限はありません。内部では 25 件ずつに分けて Shopify に送り、通信が混み合って失敗したときは 1 秒待ってもう一度だけ送り直します。それでも失敗した分がある場合は、トーストが「10件に設定しました。2件は失敗しました」のように件数で知らせます。失敗した商品だけ選び直して、もう一度保存してください。全件失敗したときは「設定に失敗しました」と出ます。

「設定」画面

左のメニューの「設定」で開きます。上の「入荷予定日」のリンクで主画面へ戻れます。

テーマに入荷予定日の表示を追加

「設定」画面の「テーマに入荷予定日の表示を追加」カード

項目	内容
テーマを選択	ブロックを追加するテーマを選びます。公開中のテーマには「（公開中のテーマ）」が付き、最初から選ばれています。選択肢に出るのは公開中と未公開のテーマだけで、処理中のテーマやデモテーマは出ません
テーマに追加	押すと新しいタブでテーマエディタが開き、商品ページのメインセクションにブロックが追加されます。追加した後はテーマエディタで「保存」が必要です
テーマをプレビュー	選んだテーマの商品ページを新しいタブで開きます。未公開のテーマの見え方を確認するときに使います

カードの下には「商品ページに入荷予定日を追加する」という青いバナーがあり、テーマエディタで手動追加できることを案内しています。日本語で表示しているときは、自動追加が失敗した場合の案内（黄色いバナー）も出ます。

言語設定

「設定」画面の「言語設定」カード。「言語を選択」で日本語が選ばれている

「言語を選択」で管理画面の表示言語を選び、「変更する」を押すと、その場で切り替わります。選べる言語は、チェコ語・デンマーク語・ドイツ語・英語・スペイン語・フランス語・イタリア語・オランダ語・ノルウェー語（ブークモール）・ポーランド語・ポルトガル語（ブラジル）・ポルトガル語（ポルトガル）・フィンランド語・スウェーデン語・トルコ語・タイ語・日本語・簡体字中国語・繁体字中国語・韓国語の 20 言語です。

この設定は使っているブラウザに保存されます。別のブラウザや別の PC で開くと、Shopify 管理画面の言語に合わせた表示に戻ります。ストアフロントの表示言語には影響しません。

ストアフロントの設定 — テーマエディタで表示を整える

商品ページでの見た目は、すべてテーマエディタのブロック設定で決めます。アプリの管理画面には見た目の設定はありません。

ブロックの選択

テーマエディタで商品ページを開き、左のセクション一覧で「シンプル再入荷日表示｜入荷予定日・在庫復活日告知」を押すか、プレビュー上のブロックをクリックすると、左に設定パネルが開きます。まだブロックが無いときは、「商品情報」セクションの「ブロックを追加」→「アプリ」タブから追加します。

設定パネルは「表示設定」「文言設定」「スタイル設定」「余白設定」「追加設定」の 5 つのグループに分かれています。設定を変えると右のプレビューにすぐ反映されます。変更を残すには右上の「保存」を押してください。

表示設定

ブロック設定パネルの「表示設定」と「文言設定」

項目	選択肢と既定値	説明
表示する条件	在庫切れのときだけ表示（既定）／常に表示	「在庫切れのときだけ表示」は、その商品が購入できない状態のときだけ入荷予定日を出します。「常に表示」は在庫があっても出します。次回入荷を予告して予約的に使いたいときは「常に表示」が向いています
日付の並び順	自動（言語に合わせる）（既定）／YYYY/MM/DD／MM/DD/YYYY／DD/MM/YYYY	「自動（言語に合わせる）」は買い手の言語に合わせた並びで、日本語なら「2027年4月15日」、英語なら「4/15/2027」、ドイツ語なら「15.4.2027」になります。固定したいときは年月日・月日年・日月年から選びます
日付の区切り	スラッシュ (/)（既定）／ハイフン (-)／ドット (.)	「日付の並び順」を「自動（言語に合わせる）」以外にしたときに使う区切り記号です。「自動」のときは効きません

「日付の並び順」の下には「「自動」は買い手の言語に合わせて並べます。」という注記が出ています。月の名前（January など）は使わず、年・月・日を数字で組み立てるので、どの言語でも表記が崩れません。

文言設定

「文言設定」の「入荷予定の文言」と「入荷時期未定の文言」

項目	既定値	説明
入荷予定の文言	空欄	日付付きで表示する文言です。文中の {date} が入荷予定日に置き換わります。例:「{date} に再入荷予定です」
入荷時期未定の文言	空欄	「入荷時期未定」の商品に表示する文言です

どちらも 空欄のままにしておくと、買い手の言語に合わせた文言（20 言語）が自動で出ます。日本語なら「2027年4月15日入荷予定」と「入荷時期未定」、英語なら「Restocking on 4/15/2027」と「Restock date not decided」です。文言を入力すると、すべての言語の買い手にその文言がそのまま出ます。海外のお客様が多いストアでは空欄のままがおすすめです。

「入荷予定の文言」に {date} を入れ忘れると日付が出なくなるので注意してください。

スタイル設定

ブロック設定パネルの「スタイル設定」

項目	選択肢と既定値	説明
テキスト配置	左揃え（既定）／中央揃え／右揃え	ブロック全体をどちらに寄せるかです。購入ボタンが中央揃えのテーマでは「中央揃え」にすると収まりがよくなります
アイコンを表示	オン（既定）	文言の左にカレンダーのアイコンを出すかどうかです
アイコンの色	#5C5F62	アイコンの色です
文字の色	#202223	文言の色です
背景の色	#F6F6F7	文言の後ろの角丸の帯の色です。テーマの背景色と同じにすると帯が消えたように見えます
文字の大きさ（PC）	16px（10〜32px、1px 刻み）	画面幅 768px 以上での文字の大きさです
文字の大きさ（スマホ）	14px（10〜32px、1px 刻み）	画面幅 768px 未満での文字の大きさです

「文字の大きさ（PC）」「文字の大きさ（スマホ）」と「余白設定」のスライダー

余白設定

項目	既定値	説明
上部余白（PC）	16px	画面幅 768px 以上でのブロックの上の余白です
上部余白（スマホ）	16px	画面幅 768px 未満でのブロックの上の余白です
下部余白（PC）	16px	画面幅 768px 以上でのブロックの下の余白です
下部余白（スマホ）	16px	画面幅 768px 未満でのブロックの下の余白です

いずれも -100〜100px の範囲を 2px 刻みで指定できます。マイナスにすると上や下の要素に近づけられます。

追加設定

「余白設定」と「追加設定」の「追加のCSS」欄

「追加のCSS」には、CSS を直接書いて見た目を上書きできます。書いた CSS はこのブロックの範囲にだけ効くように、ブロックの ID で囲んで出力されます。ブラウザの検証機能で「ur-restock-date」から始まるクラス名を確認して指定してください（例: .ur-restock-date { border: 1px solid #ccc; }）。安全のため、入力した CSS から「<」の文字だけは取り除かれます。

商品ページでの見え方

設定を保存すると、商品ページには次のように表示されます。

スマホの商品ページ。「2027年4月15日入荷予定」が購入ボタンの下に出ている

「入荷時期未定」にした商品では、日付の代わりに「入荷時期未定」と出ます。日付を入れていても、その日を過ぎると買い手のブラウザで自動的にこの表示に切り替わります。

「入荷時期未定」と表示された商品ページ

日付も「入荷時期未定」も設定していない商品には、ブロックを置いていても何も表示されません（空の枠も出ません）。

用途別のおすすめ設定

設定の組み合わせで見え方がどう変わるかを、実際のプレビューで並べます。

在庫があっても次回入荷日を予告したいとき

「表示する条件」を「常に表示」にすると、在庫のある商品にも入荷予定日が出ます。定期的に入荷する商品で「次は 5 月 20 日に入ります」と伝えたいときや、在庫を追跡していない商品に出したいときに使います。

「常に表示」にして、在庫のある商品にも「Restocking on 5/20/2027」が出ている

購入ボタンの並びに馴染ませたいとき

「テキスト配置」を「中央揃え」にすると、中央揃えの購入ボタンと揃います。「背景の色」をテーマの背景色に合わせると帯が目立たなくなり、文字だけが並んでいるように見えます。

「中央揃え」にして、ブロックが購入ボタンの中央に揃っている

文言を自分の言い回しにしたいとき

「入荷予定の文言」に「{date} に再入荷予定です」のように入れると、そのまま表示されます。「{date} 頃に入荷予定（予約受付中）」のような一言を足すこともできます。海外のお客様には同じ文言が出る点にだけ注意してください。

「入荷予定の文言」を変えて「5/20/2027 に再入荷予定です」と表示されている

アイコンを外して文字だけにしたいとき

「アイコンを表示」をオフにし、「テキスト配置」を「右揃え」にすると、価格の並びに寄せた控えめな表示になります。ミニマルなテーマや、価格の近くに置きたいときに向いています。

アイコンを非表示にして右揃えにした状態

うまく表示されないときの確認ポイント

保存したのに商品ページに出ない

反映に時間がかかっています。 このアプリが保存するメタフィールドは Shopify の CDN にキャッシュされ、商品ページへの反映に数十分から数時間かかることがあります。管理画面の一覧に日付が入っていれば保存は成功しています。しばらく待ってから、商品ページを開き直してください
在庫がある商品です。 既定の「在庫切れのときだけ表示」では、購入できる商品には出ません。在庫を追跡していない商品も「購入できる」扱いです。出したい場合はテーマエディタで「表示する条件」を「常に表示」にしてください
ブロックがテーマに入っていません。 「設定」→「テーマに追加」の後、テーマエディタで「保存」を押していないとブロックは残りません。テーマエディタで商品ページを開き、「商品情報」セクションの中にブロックがあるか確認してください
公開中のテーマとは別のテーマに追加しています。 「テーマを選択」で選んだテーマにだけ追加されます。公開中のテーマに「（公開中のテーマ）」の印が付いているか確認してください