【保存版】WooCommerce在庫切れ表示の設定とカスタマイズ術5選

WooCommerceを利用してネットショップを運営していると、避けて通れないのが商品の在庫管理と「在庫切れ」の表示問題です。

せっかくお客様がサイトを訪れてくれたのに、在庫切れの商品が分かりにくかったり、魅力的な表示になっていなかったりすると、大きな機会損失につながる恐れがあります。

この記事では、WooCommerceの標準機能を使った在庫切れ表示の方法から、CSSやPHPを使った高度なカスタマイズ、さらには売り上げを最大化するための工夫まで徹底解説します。

WooCommerceの在庫切れ表示をマスターすべき理由

ネットショップにおいて、在庫がない状態をどのように顧客に伝えるかは、ユーザー体験（UX）に直結します。
単に「在庫なし」と表示するだけでは、ユーザーはそのまま離脱してしまいます。

しかし、在庫切れの際にも「次回の入荷予定」を伝えたり、「再入荷通知」の登録を促したりすることで、将来的な顧客を確保することが可能です。

また、在庫切れ商品を非表示にするのか、あえて表示させておくのかという戦略もSEOや回遊率に影響を与えます。
まずは基本となる設定から確認していきましょう。

在庫管理の重要性とSEOへの影響

検索エンジンは、ユーザーが求める情報（商品）が適切に提供されているかを評価します。
在庫切れが続く商品を放置しすぎると、ショップの信頼性が下がることもあります。

一方で、人気商品が一時的に欠品している場合は、そのページを維持しつつ適切なステータスを表示することがSEO評価を維持するコツです。

WooCommerce標準機能での在庫切れ表示設定

WooCommerceには、標準で充実した在庫管理機能が備わっています。
プラグインを導入する前に、まずは管理画面から行える基本設定をマスターしましょう。

設定場所は、「WooCommerce」＞「設定」＞「商品」＞「在庫」タブです。
ここでショップ全体の在庫挙動を一括管理できます。

基本設定の項目一覧

設定項目	機能の概要
在庫管理を有効にする	商品ごとの在庫数を追跡するかどうかを決定します。
在庫保持（分）	未決済の注文が在庫を確保し続ける時間を設定します。
通知	在庫少、在庫切れの際にメール通知を受け取るか設定します。
在庫切れの表示	カタログ上で在庫切れ商品を非表示にするか選択できます。
在庫表示フォーマット	「残り5点」や「在庫あり」などの表示形式を選べます。

特に「在庫切れの表示」チェックボックスには注意が必要です。
ここにチェックを入れると、在庫がない商品はショップページや検索結果から完全に消えてしまいます。

商品ページへの直接アクセスは可能ですが、サイト内回遊からは外れるため、SEO効果を残したい場合はチェックを外しておくのが一般的です。

「在庫切れ」ラベルを商品一覧に表示する方法

デフォルトのWooCommerceテーマや一部のシンプルすぎるテーマでは、商品一覧（アーカイブページ）で在庫切れかどうかが一目で判別しにくいことがあります。

ユーザーが詳細ページを開いてから「なんだ、在庫なしか」とがっかりして戻る手間を省くために、カード形式のリストに「SOLDOUT」などのラベルを追加するのは非常に親切な設計です。

テーマの機能をチェックする

多くの高機能テーマ（Astra, OceanWP, Shoptimizerなど）では、カスタマイザー内に「在庫切れラベルの表示」オプションが用意されています。

まずは以下の手順で確認してください。
1. 「外観」＞「カスタマイズ」を開く
2. 「WooCommerce」＞「商品カタログ」などを選択
3. 「在庫切れのバッジ」や「ステータス表示」の項目を探す

もし項目がない場合は、後述するPHPのフックを利用したカスタマイズが必要になります。
通販サイトでは、この視認性がコンバージョンを左右するため、こだわっておきたいポイントです。

特定の商品の在庫表示を個別に変更する

ショップ全体の共通設定だけでなく、商品ごとに異なる在庫ステータスを持たせることも可能です。
例えば、「受注生産品」や「予約商品」などの場合です。

商品編集画面の「在庫」データボックスを使用します。
ここで「在庫ステータス」を手動で切り替えることができます。

在庫ステータスの種類

• 在庫あり: 通常通り購入可能な状態です。
• 在庫切れ: カートに入れるボタンが消え、通知が表示されます。
• 予約注文可: 在庫がなくても注文を受け付けます。

「予約注文可」を選択した場合、顧客には「在庫切れ（予約注文可能）」といったメッセージが表示されます。
このテキストも、言語ファイルやフィルターフックを使って変更可能です。

Amazonなどの大手通販サイトでも、入荷待ちの商品を先行予約させる手法はよく使われており、コスパ最強の運営手法と言えるでしょう。

在庫切れ時の「カートに入れる」ボタンの挙動

在庫が切れると、WooCommerceは自動的に「カートに入れる」ボタンを非表示にします。
しかし、ただ消えるだけでは不親切な場合があります。

代わりに「入荷通知を受け取る」ボタンを表示させたり、「類似商品を見る」リンクを設置したりすることで、ユーザーを次のアクションへ誘導できます。

ボタンをカスタマイズするメリット

標準ではボタンが消える場所に「お取り寄せ」や「問い合わせ」といったボタンを配置することで、直接の販売はできなくてもリード（見込み客）の獲得につなげることができます。

これは、楽天市場やYahoo!ショッピングなどのモール型サイトでもよく見られる工夫であり、自社サイトでも積極的に取り入れるべき戦略です。

CSSで在庫切れ表示をスタイリッシュに装飾する

デフォルトの「在庫切れ」というテキストは、少し味気ないと感じるかもしれません。
CSSを使えば、色を変更したり、バッジのように見せたりすることが簡単にできます。

以下のクラス名がWooCommerceで一般的に使用されます。
.stock.out-of-stock

簡単なデザイン変更例

例えば、文字を赤くして太字にするだけでも、視認性は大幅にアップします。
また、背景に色をつけて角丸のボックスにすることで、より「警告」や「ステータス」としての意味合いを強めることができます。

「在庫切れだからこそ、目立たせてお客様を迷わせない」という考え方が、使いやすいショップへの近道です。

在庫切れ商品を非表示にするメリットとデメリット

WooCommerceの設定画面で「在庫切れの表示」にチェックを入れると、在庫がない商品はショップから姿を消します。
この設定を適用する前に、ショップ運営におけるメリットとデメリットを正しく理解しておきましょう。

一見すると、買えない商品が並んでいるのは不快に思えるかもしれませんが、あえて表示させておくことで得られるメリットも非常に大きいのです。

メリット：ショップの清潔感と信頼性

在庫切れ商品を非表示にする最大のメリットは、ユーザーが「欲しい！」と思った商品が常に購入可能であるという安心感です。
特に商品数が非常に多いショップでは、在庫切ればかりが並んでいると「管理されていないサイト」という印象を与えてしまいます。

新着商品一覧やおすすめ商品の中に在庫切れが混じらないことで、スムーズな購買体験を提供することが可能になります。

デメリット：SEOと回遊率の低下

一方で、商品を非表示にすると、そのページが持っていた検索エンジンからの評価（SEO）がリセットされるリスクがあります。
また、「このショップには他にどんな商品があるのか」という期待感を削いでしまう可能性もあります。

比較項目	非表示にする	表示し続ける
ユーザー体験	購入ミスがなく快適	選択肢が多く見える
SEO評価	インデックスから消えるリスク	評価を維持できる
再入荷の期待	与えられない	通知などで繋ぎ止め可能

長期的に見て、「再入荷予定があるもの」は表示し、「廃盤になったもの」は非表示にするといった柔軟な運用が、コスパ最強のショップ運営に繋がります。

PHPフックを活用した高度な在庫メッセージの変更

「在庫切れ」という標準の文言をもっと魅力的なものに変えたい場合は、WordPressのテーマファイル（functions.php）にコードを追記するのが最も効果的です。

WooCommerceには、表示テキストを動的に変更するための「フィルターフック」が多数用意されています。
これを使えば、プラグインなしで自由自在にカスタマイズが可能です。

在庫状況テキストを書き換えるコードの例

例えば、単なる「在庫切れ」ではなく、「現在完売中。再入荷までお待ちください」といった柔らかい表現に変更できます。
また、特定の商品カテゴリーだけ文言を変えるといった高度な処理も可能です。

「お急ぎの方はお問い合わせください」といった一文を添えるだけでも、ユーザーがサイトを離れる前にコンタクトを取ってくれる確率が高まります。

通販サイトにおいて、言葉の選び方は「接客」そのものです。
デフォルトの設定に満足せず、自社のブランドイメージに合った表現を探求しましょう。

「再入荷通知」プラグインで機会損失をゼロにする

在庫切れ表示の究極の活用法は、「再入荷通知機能」の導入です。
商品が欠品している間に、顧客のメールアドレスを収集し、入荷と同時に自動でメールを送る仕組みを作ります。

これにより、在庫切れが単なる「売り損じ」ではなく、「予約リストの作成」へと変わります。

おすすめの再入荷通知プラグイン

• Back In Stock Notifier for WooCommerce: シンプルで使いやすく、多くのショップで採用されています。
• WooCommerce Waitlist: 待機人数を管理画面で確認できるため、仕入れ数の判断材料になります。
• YITH WooCommerce Stock Guide: 高機能で、より視覚的なカスタマイズが可能です。

これらのツールを導入することで、Amazonや楽天のような「入荷したら教えてくれる」という利便性を自社ショップでも実現できます。
リピーター獲得において、これほどコスパ最強な投資はありません。

バリエーション商品での在庫切れ表示の注意点

サイズや色がある「バリエーション商品」の場合、在庫表示は少し複雑になります。
「赤のMサイズはあるけれど、青のLサイズは在庫切れ」といった状況が頻繁に起こるからです。

WooCommerceの標準動作では、ユーザーがドロップダウンから選択するまで在庫状況が分からないことが多いのですが、これはユーザーにとってストレスになります。

バリエーション在庫を見やすくする工夫

ユーザーが選択肢を選ぶ前に、どのバリエーションが欠品しているか一目でわかるようにカスタマイズするのが理想です。

例えば、ドロップダウン内の項目名の横に（在庫切れ）と表示したり、選択できない項目をグレーアウト（無効化）したりする設定が必要です。
これにより、「選んでから買えないと知る」という最悪の体験を回避できます。

スマートフォンユーザーは特に「何度もタップし直す」ことを嫌います。
モバイルフレンドリーな在庫表示こそが、現代の通販サイトに求められる基準です。

在庫数に応じた「残りわずか」表示の出し方

「在庫切れ」を表示させる手前で、「残りわずか」という表示を出して購買意欲を煽るテクニックも非常に有効です。
人間には「数が少ないものを価値が高いと感じる」心理（希少性の原理）があるためです。

WooCommerceの設定にある「在庫表示フォーマット」を活用しましょう。

設定のヒント

「在庫が少なくなった時にのみ、残り在庫数を表示する」設定にします。
例えば、在庫が残り3個になったタイミングで「残り3点！ご注文はお早めに」と表示されるように設定変更できます。

この数値（閾値）は、ショップ全体の共通設定だけでなく、商品ごとに個別に設定することも可能です。
「限定品」などは早めにカウントダウンを開始し、「定番品」はギリギリまで表示しないといった戦略が有効です。

在庫切れ商品の並び順を最後にするカスタマイズ

ショップページで在庫がある商品とない商品が混在していると、買い物効率が悪くなります。
理想は、在庫がある商品を上に、在庫切れの商品をリストの最後に自動で移動させることです。

これにより、ユーザーはまず買える商品に集中でき、在庫切れ商品が邪魔になることがありません。

並び順変更の仕組み

これはWooCommerceの標準機能にはないため、フィルターフック（woocommerce_get_catalog_ordering_args）を使用して、在庫ステータスをソートの第一優先順位に設定します。

「在庫切れ商品は見せたいけれど、邪魔はしたくない」というジレンマを解決する最高のカスタマイズです。
メルカリなどのフリマアプリでも採用されているこの並び順は、現代のユーザーにとって非常に馴染み深いものです。

在庫切れ時でも「予約注文」を可能にする設定術

WooCommerceには「在庫切れ」を単なる販売停止にするのではなく、入荷前に注文を受ける「バックオーダー（予約注文）」機能が備わっています。
この機能を活用すれば、在庫が手元にない期間でも売上を立て続けることが可能です。

特に、入荷サイクルが決まっている商品や、受注生産に近い形態の商品にとっては、機会損失を防ぐコスパ最強の手段となります。

バックオーダーの3つの設定パターン

商品編集画面の「在庫」タブにある「バックオーダーを許可するか？」項目では、以下の3つから選択できます。

設定値	顧客への表示・挙動
許可しない	在庫が切れると「在庫切れ」と表示され、購入不可になります。
許可する（顧客に通知する）	注文は可能ですが、「入荷待ち」である旨が表示されます。
許可する	通常在庫がある場合と同じように注文を受け付けます。

おすすめは「許可する（顧客に通知する）」の設定です。
顧客に無断で配送が遅れるトラブルを防ぎつつ、納得した上で予約購入してもらえるため、ショップの誠実さをアピールできます。

在庫切れ商品の個別ページを「カタログモード」にする

期間限定の商品や、次回の入荷が未定の商品の場合、ページ自体は残して「カタログ（展示）」として活用する方法があります。
購入はできませんが、商品の魅力を伝え続けることで、ブランドの認知度を高める役割を果たします。

「今は買えないけれど、いつか欲しい」というファンを育てるための戦略的なアプローチです。

お問い合わせフォームへの誘導

カートボタンを消す代わりに、Contact Form 7などのプラグインと連携した「この商品について問い合わせる」ボタンを設置しましょう。
在庫切れをきっかけに直接コミュニケーションを取ることで、代替商品の提案や、法人大口注文に繋がるケースも少なくありません。

ネットショップは自動販売機ではありません。
在庫がない時こそ、丁寧な導線設計が「選ばれるショップ」への分かれ道となります。

Google検索での「在庫なし」表示（構造化データ）対策

SEOの観点で見逃せないのが、Googleの検索結果に表示される「在庫あり・なし」のステータスです。
WooCommerceは標準で「構造化データ（Schema.org）」を出力しており、検索エンジンに現在の在庫状況を伝えています。

これを適切に管理しないと、検索結果で「在庫なし」と表示され続け、クリック率が激減してしまいます。

検索結果の鮮度を保つために

在庫が復活した際には、速やかに管理画面を更新し、必要であればサーチコンソールから再クロールをリクエストしましょう。

「検索結果では在庫ありなのに、開いたら在庫切れ」というギャップは、ユーザーの信頼を大きく損ないます。
定期的な在庫同期（POSレジ連携など）を行っているショップは、この点において非常に有利です。

「在庫切れ」ページからの関連商品レコメンド術

もしユーザーが在庫切れのページに辿り着いてしまったら、そこを「新しい出会いの場」に変えてしまいましょう。
ページ下部に「こちらの商品もおすすめです」というレコメンド（関連商品）を強力に表示させます。

WooCommerceの「アップセル」や「クロスセル」機能をフル活用する場面です。

離脱させないための3ステップ

1. 現在の在庫切れを謝罪する一文を添える。
2. 似たようなスペックの代替商品を3〜5つ提示する。
3. ショップ全体の売れ筋ランキングへのリンクを貼る。

「在庫がない＝接客終了」ではなく「在庫がない＝別の提案」と捉えることで、サイト全体の直帰率を劇的に下げることができます。
この粘り強さが、大手モールに負けない自社サイトの強みになります。

スマホユーザーに優しい「在庫切れ」UIデザイン

通販サイトのアクセスの大半はスマートフォンからです。
PC画面では気にならなくても、スマホの小さな画面では「在庫切れ」の文字が他の要素に埋もれてしまうことがあります。

親指で操作するユーザーにとって、ストレスのないUI（ユーザーインターフェース）を意識しましょう。

スマホ最適化のチェックポイント

• 在庫切れのバッジは、商品画像の左上に大きく配置されているか。
• 文字サイズは小さすぎず、コントラストははっきりしているか。
• 「再入荷通知」の入力フォームは、キーボードで隠れない位置にあるか。

「スマホで見やすい＝買いやすい」という公式は、在庫切れ表示においても例外ではありません。
実機でのテストを繰り返し、視覚的に迷わせないデザインを追求しましょう。

WooCommerce在庫管理のよくあるトラブルと解決策

最後に、在庫表示に関する運用面でのトラブルとその回避方法をまとめます。
システムトラブルで「在庫があるのに売れない」「ないのに売れてしまった」という事態は、ショップの信用に関わる大問題です。

未然に防ぐためのチェックリストとして活用してください。

トラブル解決チャート

現象	主な原因	解決策
在庫を戻したのに表示が変わらない	キャッシュプラグインの影響	サーバーやプラグインのキャッシュをクリアする。
注文キャンセル分が在庫に戻らない	設定の不備	注文ステータスの変更ルールを確認する。
バリエーションが選べない	親商品の在庫設定ミス	個別のバリエーション管理にチェックが入っているか確認。

「迷ったら一度設定をデフォルトに戻す」のが、WordPressカスタマイズの鉄則です。
複雑なプラグインを入れすぎず、シンプルな構成を保つことが、安定したショップ運営のコツです。

まとめ：WooCommerceの在庫切れ表示を戦略に変えよう

WooCommerceにおける「在庫切れ」の表示は、単なるシステム的な状態報告ではありません。
それは顧客との対話であり、次の売上を作るためのマーケティングチャンスです。

今回ご紹介した表示設定やカスタマイズ、プラグイン活用を実践することで、あなたのショップはより使いやすく、より信頼されるものになるはずです。

在庫が切れても慌てず、適切なメッセージと代替案を提示して、顧客をファンに変えていきましょう。
まずは、管理画面の「在庫」設定を一通り見直すことから始めてみてください！