コンテンツにスキップ

Breadcrumb

より明確なパンくずナビゲーションのために手動の親リンクを追加します。

このブロックを使用すると、パンくずリストに固定の親リンクを追加できます。より明確で意図的なナビゲーション経路にしたい場合に、重要な上位ページへ顧客を戻すよう案内するのに役立ちます。テーマコンポーネントがどのように整理されているかの概要については、セクションとブロックに関するShopifyドキュメントを参照してください。

現在のページの真上に実際に位置するコレクション、ランディングページ、またはコンテンツハブを指すために使用できます。参考として、ソース提供のガイドをご覧ください: Breadcrumbブロックリファレンス

主な設定では、親リンク自体を制御します。つまり、顧客に表示されるラベル、リンク先、そしてリンクを新しいタブで開くかどうかです。パンくずをひと目で確認しやすく保つために、テキストは短く、なじみのあるものにしてください。

閲覧経路における本当の親ステップと感じられるリンク先を選んでください。このブロックは、リンクが販促ではなくナビゲーションを支える場合に最も効果的です。

手動の親リンクは、ページ階層における実際の一段階戻る導線を反映している場合にのみ追加してください。リンクに関連性が薄い、または範囲が広すぎると感じられる場合、パンくずの有用性は低下します。

通常、パンくずナビゲーションでリンクを新しいタブで開く必要はありません。多くの場合、同じタブを使う方が、より自然な閲覧体験になります。

表示設定では、このブロックをモバイル、デスクトップ、またはその両方に表示するかどうかを制御します。これは、ブロックをどこでも削除せずに、より狭いレイアウトを簡潔にしたい場合に役立ちます。テーマエディターでの配置やデバイス関連の設定については、テーマエディター機能の概要に関するShopifyドキュメントを参照してください。

一方のデバイスタイプでこのブロックを非表示にする場合でも、顧客がより上位のページへ移動するための別の明確な方法があることを確認してください。ソース提供の表示設定リファレンスはこちらで確認できます: 表示設定リファレンス

  1. リンク先に一致させる。 顧客が開くページに近いリンクテキストを使用してください。
  2. 実際の親ページを選ぶ。 販促用のリンク先ではなく、上位カテゴリ、ハブ、または概要ページにリンクしてください。
  3. 不要な新しいタブを避ける。 特別な理由がない限り、パンくずリンクは同じタブで開いてください。
  4. 小さい画面を確認する。 モバイルでブロックを非表示にする場合は、そのページが引き続き簡単に移動できると感じられることを確認してください。
  5. 両方のビューポートを確認する。 デスクトップとモバイルでの表示設定により、パンくずの収まり方、配置、見え方が変わる可能性があるため、公開前に両方を確認してください。
  6. 経路をシンプルに保つ。 近くにあるナビゲーションを重複させるだけで明確さが向上しない場合は、手動の親リンクを追加しないでください。