パンくずリストを一部だけ表示するようにしたいです

コマースクリエイターご利用店舗様専用の記事です

パンくずリストをメイングループのみ表示する

レイアウト内のパーツを調整することで可能です。

（１）commerce creator＞テーマ＞レイアウト と進み、種類：商品　にチェックを入れて「検索する」を押下してください。

（２）編集したい商品詳細レイアウトの右側の をクリックしてください。

（３）レイアウト変更画面に進み「サブグループパンくずリストパーツ」の右側の…をクリック後、
「パーツを外す」をクリックして「保存する」をクリックしてください。

本設定によりメイングループのパンくずリストのみ（１行のみ）が表示されます。

サブグループパンくずリストパーツを一部のみ表示する

メイングループ・サブグループのパンくずリストを両方を表示させたまま、
サブグループを一部のみ表示したい場合にはCSSをご利用ください。

例：サブグループの表示は2つのみとし、合計3行（メイングループ1行・サブグループ2行）の表示とする


commerce creator＞テーマ＞利用中テーマ「オリジナルCSS」に以下を追記ください。

/*パンくずリストを一部のみ表示するCSS*/
.fs-c-breadcrumb__list {
  display:none;
}
.fs-c-breadcrumb__list:first-child {
  display:block;
}
.fs-c-breadcrumb__list--subgroup:nth-child(2) {
  display:block;
}

サブグループの表示を2つ以上表示させるには、
以下の(2)の括弧内の数字を増やしたCSSをさらに後ろに追記することで可能です。

例えば3つ目も表示したい場合は(3)のCSSを追記します。
.fs-c-breadcrumb__list--subgroup:nth-child(3) {
  display:block;
}

－－－－－－－－－－－－－－－－－－－－－－－－
【ご注意】
CSSでのカスタマイズは思わぬ挙動をする場合がございます。
CSS追記後、意図した表示や動作になるか、
購入が正しく行えるかなど、必ず動作確認をお願いいたします。
－－－－－－－－－－－－－－－－－－－－－－－－