WooCommerce 10.9で「あとで買う」「ほしいものリスト」が実験搭載
WooCommerce 10.9が2026年6月にリリースされ、ログイン顧客向けの実験的なショッピングリスト機能「Shopper Lists」が導入された。カート画面に表示される「あとで買う（Save for Later）」と、商品ページに追加される「ほしいものリスト（Wishlists）」の2機能が含まれている。
いずれもデフォルトでは無効化されており、店舗運営者が明示的にオンにして使うオプトイン方式だ。今回は WooCommerce のブロックベースショッピング体験を前提に設計されており、従来のショートコードベースの店舗では動作が保証されない点に注意が必要だ。
両機能は同じ Shopper Lists バックエンドを共有しており、今回の実験リリースを経て、将来的にはさらに多くのリスト系機能へ拡張される可能性がある。
2つのショッピングリスト機能の詳細
Save for Later（あとで買う）
「Save for Later」はカートブロックの各商品行に「あとで買う」というアクションを追加する。ログイン顧客がこのボタンを使うと、その商品はカートから取り除かれ、カートブロックの下部に新設された「あとで買う」セクションへ移動する。
顧客はあとで買うセクションから商品をカートに戻したり、リストから削除したりできる。バリエーション商品（サイズや色を選択する商品）の場合、選択済みの属性情報が保持されるため、「どのサイズを保存したか」をあとで確認できるのが実務上の利点だ。
現時点ではカートブロックのみ対応で、ミニカートには未対応。WooCommerce 開発チームの発表によれば、ミニカート対応は今回の実験リリースのスコープ外とされている。
Wishlists（ほしいものリスト）
「Wishlists」は Add to Cart with Options ブロックを使っている商品ページに「ほしいものリストに追加」ボタンを表示する。単純商品だけでなく、選択済みのバリエーション商品も保存できる。
保存した商品はマイアカウントの「ほしいものリスト」セクションから一覧表示され、そこからカートへの移動や削除が可能だ。店舗運営者は Wishlist ブロックを任意の固定ページに配置することで、顧客が自分専用のほしいものリストページを持てるようになる。
技術的基盤
Save for Later と Wishlists は、どちらも同一の Shopper Lists バックエンドを土台にしている。Store API、Interactivity API ストア、共有データ構造の3層で構成されており、今後のリスト系機能追加を見据えた拡張性の高い設計だ。
共有 Store API エンドポイント
両機能のデータ操作は、すべて以下の共通エンドポイント群を通じて行われる。
/wc/store/v1/shopper-lists/Store API は WooCommerce のブロックベースショッピング体験を支える REST API 層で、カートやチェックアウト、商品データの取得を担う。今回の Shopper Lists 実装により、この API 層にリスト操作の機能が追加された形だ。
Developer WooCommerce Blog の発表によると、この API 表面はメイン機能マージ（#65263）で導入され、Wishlist ボタンは Add to Cart with Options ブロックへのレンダリング時注入（#65765）によって復帰したとされている。
Interactivity API との統合
Interactivity API は WordPress 6.5 で導入された、ブロックにインタラクティブなフロントエンド動作を追加するための公式 API だ。Shopper Lists では、カートブロック内での「あとで買う」への移動や、商品ページでの「ほしいものリストに追加」といった操作が、ページ遷移なしで即座に反映される。
この API を利用することで、従来の WooCommerce で課題だった「操作のたびにページ全体がリロードされる」問題が解消され、顧客体験が大きく向上する。とくに商品数が多い店舗では、体感速度の差が顕著になるだろう。
機能の有効化手順
これらの機能はカートの挙動、商品ページの表示、マイアカウント、ブロックテンプレート、ログイン顧客データ、Store API との通信と、多岐にわたる領域に影響を与える。そのため WooCommerce チームは「本番環境ではなく、ステージング環境かローカルテストサイトで検証してほしい」と呼びかけている。
有効化に必要な条件
- WooCommerce 10.9.1 以降がインストールされていること
- ステージング環境またはローカルのテストサイトであること
- カートページが Cart ブロックで構築されていること
- 商品詳細ページのテンプレートが Add to Cart with Options ブロックを使用していること
- テスト用の顧客アカウントが用意されていること
設定手順
管理画面の WooCommerce ＞ 設定 ＞ 高度な設定 ＞ 機能 に移動し、以下の2つの実験的機能を有効化するだけだ。
- Save for Later in Cart（カート内のあとで買う）
- Wishlists（ほしいものリスト）
テスト用の商品構成としては、単純商品を1点以上、選択式属性を持つバリエーション商品を1点以上用意しておくと、両機能の動作を網羅的に確認できる。
テストすべきポイント
WooCommerce チームはデベロッパーや制作会社、店舗構築者に対し、実際の店舗構成に近い環境でのフィードバックを求めている。とくにカスタマイズされたブロックテンプレートや多数の拡張機能を導入したサイトでの動作報告が重視されている。
Save for Later のテスト項目
- カート内の商品に対して「あとで買う」ボタンが表示されるか
- ボタン押下後、商品が「あとで買う」セクションに正しく移動するか
- バリエーション商品の選択属性（サイズや色）が保持されているか
- 「カートに戻す」で商品がカートに復帰するか
- 「削除」でリストから消えるか
Wishlists のテスト項目
- 商品ページに「ほしいものリストに追加」ボタンが表示されるか
- 単純商品とバリエーション商品の両方が保存できるか
- マイアカウント ＞ ほしいものリスト に保存商品が正しく表示されるか
- ほしいものリストからカートへの移動が正常に動作するか
- Wishlist ブロックを任意の固定ページに配置して表示できるか
無効化時のクリーンアップ確認
両方の実験的機能を無効化したあと、カート、商品ページ、マイアカウントを再訪問し、Shopper Lists の UI が完全に消えるかを確認する必要がある。無効なブロックが残ったり、テンプレート出力が崩れたりしないことが、安定版への移行条件のひとつになる。
実務への影響と今後の展望
Shopper Lists の登場は、WooCommerce 店舗における顧客維持の選択肢を大きく広げる。従来の「その場で買うか、離脱するか」という二択から、「いったん保存して後日判断する」という選択肢が加わることで、カート放棄率の低減につながる可能性がある。
とくにアパレルや家具など、購入までに検討期間が長い商材を扱う店舗にとっては、ほしいものリスト機能の価値は高い。顧客が複数回にわたって同じ商品を閲覧する行動パターンがある場合、リスト保存によってコンバージョンまでの導線が短縮される。
ただし現時点では実験的機能であり、本番環境での利用は推奨されていない。カスタマイズされたブロックテーマや拡張機能との競合が発生する可能性があるためだ。WooCommerce チームが特に求めているのは、まさにそうした「実店舗に近い複雑な環境」でのテスト報告である。
フィードバックは Developer WooCommerce Blog の該当記事コメント欄、または GitHub ディスカッション（#66038）で受け付けている。制作会社やデベロッパーにとっては、正式リリース前に自社のクライアント店舗との相性を把握できる貴重な機会といえる。
この記事のポイント
- WooCommerce 10.9 が Shopper Lists 機能を実験的に導入した
- 「Save for Later」はカートブロックに商品を一時保存する機能
- 「Wishlists」は Add to Cart with Options ブロックと連携するほしいものリスト
- 両機能はデフォルト無効で、管理画面の「高度な設定 ＞ 機能」から有効化する
- 本番環境ではなくステージング環境でのテストが強く推奨されている
・ 複数業界における17年間のデジタルビジネス開発経験
・ ウェブサイト開発のためのHTML、PHP、CSS、JavaScript等の実用的知識
・ 15ヶ国語対応の多言語SaaSの開発経験
・ 17年間にも及ぶ、Eコマース長期運営経験
・ 幅広い業界でのSEO最適化の豊富な経験
WooCommerce 10.9でカラースウォッチがコア機能に。商品ページの視覚表現が大幅に向上
WooCommerce 10.9で商品属性に新しいタイプ「Color / Image」が追加された。これまではテキストリンクやセレクトボックスでしか選べなかった色や柄のバリエーションを、フロントエンド上で視覚的なスウォッチ（小さな色見本）として表示できるようになる。
この機能はブロックテーマ利用時の実験的機能として提供され、商品フィルターブロックや「カートに追加＋オプション」ブロック内のバリエーションセレクターに自動適用される。WooCommerce Developer Blogの記事によると、6月8日予定のベータ版から利用可能だ。
本記事では、この新機能の概要、具体的な設定手順、技術的な内部構造、そして他のブロックとの共有APIの仕組みを詳しく解説する。WooCommerceストアを運営する担当者や、ECサイトのデザインを改善したい制作者に役立つ情報だ。
カラースウォッチ機能の概要
上の比較で分かるように、テキストだけでは実際の色味が伝わらず、購入者は商品画像だけを頼りに判断するしかなかった。今回の変更で、Chipsブロック（チップス）やListブロック（リスト）での表示が直感的になる。
対応するブロックと表示パターン
カラースウォッチが適用されるのは、以下の2つのブロック内でColor / Image属性がレンダリングされる場面だ。
- 商品フィルター内の「属性で絞り込む」ブロック（Filter by Attribute）
- 「カートに追加＋オプション」ブロック内のバリエーションセレクター（Variation Selector）
Chipsスタイルでは、各スウォッチがHEXカラーコードまたは画像を使った円形で表示される。管理画面で設定した色や画像がそのままフロントエンドに反映される仕組みだ。Listスタイルでは、属性名の隣に小さなスウォッチが並ぶ。これにより、フィルター画面でも色の判別が容易になる。
色だけでなく画像スウォッチにも対応
今回の機能は単なるカラーピッカーにとどまらない。属性タイプ名が「Color / Image」であることからも分かるとおり、メディアライブラリから画像を選択することも可能だ。チェック柄やヒョウ柄、グラデーションパターンなど、HEXコードでは表現しきれない複雑なデザインもスウォッチ化できる。
この画像スウォッチ機能は、ファッションECやインテリアECで特に効果を発揮する。テキストだけでは「ダマスク柄」「ストライプ」といった情報が伝わりにくいが、小さなサムネイル画像があれば購入者は直感的に商品の外観を把握できる。
設定手順と利用条件
カラースウォッチ機能はブロックテーマでのみ利用可能な実験的機能として提供される。有効化の手順は以下の3ステップだ。
特徴的なのは、この機能が完全にオプトイン方式である点だ。既存の属性をColor / Imageタイプに更新しない限り、ストアフロントにスウォッチは一切表示されない。既存のテキスト表示を維持したい商品がある場合も、属性タイプを変更しなければ従来通りの挙動を保てる。
属性タイプの内部的な識別子
属性のタイプを設定すると、各属性ターム（付与する値）の編集画面にカラーピッカーと画像選択の入力欄が追加される。内部的には、この属性タイプは「wc-visual」というスラッグで識別される。
スラッグの先頭に「wc-」というプレフィックスが付与されているのは、既存のプラグインが独自に登録している可能性のあるカスタム属性タイプとの名前衝突を防ぐためだ。すでに何らかのカラースウォッチ系プラグインを導入しているストアでも、コア機能とプラグイン機能が競合することなく共存できる設計になっている。
ブロックテーマが必須条件
現時点では、クラシックテーマではこの機能は動作しない。あくまでブロックテーマ（Site Editing対応テーマ）に限定された実験的機能だ。クラシックテーマ利用者向けには、引き続きサードパーティ製のカラースウォッチプラグインが代替手段となる。
正式リリースまでの間にクラシックテーマ対応が追加されるかは明言されていないが、WooCommerceのブロック化推進の流れを踏まえると、今後もブロックテーマを前提とした機能拡充が続くと見ておくのが妥当だろう。
共有インナーブロックによるブロック間の連携強化
カラースウォッチ機能と並行して、WooCommerceチームはブロック間のインナーブロック共有APIにも手を入れた。具体的には、「商品フィルター」ブロックと「カートに追加＋オプション バリエーションセレクター」ブロックが同じインナーブロックを再利用できるようになっている。
これまでは、商品フィルター用のChipsブロックとバリエーションセレクター用のUIが別々に実装されていた。今回の変更で、片方のブロックに加えられた改善がもう片方にも自動的に反映されるようになる。開発者視点では、メンテナンス対象のコードが減り、一貫性のあるUIを提供しやすくなるメリットがある。
また、後方互換性にも配慮されている。Variable Product（バリエーション商品）テンプレートパーツをカスタマイズしているストアでも、フロントエンド表示時やエディターで開いた際には、自動的に新しいインナーブロックが適用される仕組みだ。既存のカスタマイズが壊れる心配はない。
今後のロードマップとテスト参加方法
WooCommerce Developer Blogの記事によると、カラースウォッチ機能は6月8日予定のWooCommerce 10.9ベータ版からブロックテーマ上のフィーチャーフラグ（機能フラグ）として提供される。すでにGitHub上のナイトリービルドでもテスト可能だ。
正式版リリースに向けた注意点
現時点では実験的機能という位置付けであるため、本番環境への適用は避け、まずはステージングサイトでテストすることをWooCommerceチームは推奨している。テスト中に発見した不具合や改善要望は、GitHubのWooCommerceリポジトリのIssueトラッカーで報告できる。
実験的機能がいつ正式機能に格上げされるかは明言されていないが、WooCommerceのリリースサイクルを踏まえると、大きな問題が報告されなければ2〜3バージョン以内に正式対応となる可能性が高い。
プラグイン開発者への影響
「wc-visual」という標準化された属性タイプが追加されたことで、サードパーティ製プラグインやテーマ開発者にも恩恵がある。視覚的属性を識別するための統一的なパターンができたため、複数のプラグイン間での相互運用性や拡張性が高まる。
たとえば、商品エクスポートプラグインがスウォッチ情報をCSVに含めたり、カスタムテーマがスウォッチのスタイルを独自に調整したりする際に、「wc-visual」というスラッグを基準に処理を分岐できるようになる。
この記事のポイント
- WooCommerce 10.9で商品属性に「Color / Image」タイプが新設され、フロントエンドで視覚的なスウォッチ表示が可能になる
- 商品フィルターとバリエーションセレクターの両方で、ChipsブロックとListブロックに自動適用される
- HEXカラーだけでなくメディアライブラリの画像もスウォッチとして使用できる
- ブロックテーマ限定の実験的機能であり、設定画面のトグルで明示的に有効化するオプトイン方式
- 共有インナーブロックAPIの改善により、複数ブロック間で一貫性のあるUIとメンテナンス効率の向上が図られている
・ 複数業界における17年間のデジタルビジネス開発経験
・ ウェブサイト開発のためのHTML、PHP、CSS、JavaScript等の実用的知識
・ 15ヶ国語対応の多言語SaaSの開発経験
・ 17年間にも及ぶ、Eコマース長期運営経験
・ 幅広い業界でのSEO最適化の豊富な経験