実装記録｜Shopify・HTML/CSS・Tailwind 備忘ログ

【Shopify Be Yours】色別商品ページの作り方｜兄弟商品とカラースウォッチ設定ガイド

2025年9月23日

Be Yoursテーマには、通常のShopifyでは実現しづらい「色違い商品を別々のURLで管理しながら、1つの商品のように見せる」機能があります。これが「Sibling Products（兄弟商品）」機能です。通常のバリエーション機能との違い： ✅ 兄弟商品：色ごとに独立したURL → 詳細な分析・SEO対策が可能今回は、この便利な機能の設定方法を、実際の画面を見ながら解説していきます。こちらの記事を参考に実装を試みました。 https://themes.shopify.com/themes/be-yours/presets/be-yours 「Sibling Products（兄弟商品）」機能を実装した写真になります。 1. ざっくり全体像兄弟商品をリンク → メタフィールド & ブロックカラースウォッチ設定テーマ設定 > カラースウォッチ(メタフィールドで設定したバリエーション名:カラーコード) 判定キーはデフォルトテーマコンテンツ >... 続きを読む...