広大な店舗をさまよっていて、どこから始めたのか、メイン通路に戻る方法がわからなくなったことはありませんか？大きなオンラインストアのナビゲーションも同じように感じることがあります。
パンくずリストは、ウェブサイト上でたどってきた経路を示す小さなナビゲーショントレイルであり、買い物客をWooCommerceストアに案内するのに役立つ標識のようなものです。
顧客がサイト内を移動しやすくなるだけでなく、検索エンジンもサイトの構造をより深く理解できるようになり、SEOの向上につながる可能性があります。
朗報は、WooCommerceストアにパンくずリストを追加するのは驚くほど簡単であるということです。この記事では、WooCommerceのパンくずリストをすぐに簡単に追加できる方法をいくつかご紹介します。
なぜWooCommerceパンくずリストを追加する必要があるのですか？
パンくずリストは、製品ページやブログ記事の上部に表示されるナビゲーションリンクです。これらのリンクは、訪問者が現在表示しているページにどのようにたどり着いたかを示します。
たとえば、衣類を販売するWooCommerceストアがある場合、パンくずメニューは次のようになります：ホーム » メンズファッション » シャツ＆ポロ » フォーマルシャツ。
WooCommerceでパンくずリストを有効にすると、顧客はオンラインストアをより簡単にナビゲートし、探している製品を見つけることができます。製品属性またはカテゴリをクリックするだけで、関連製品を表示できます。
パンくずリストは、検索エンジンがeコマースストアのリンクの階層と構造を理解するのに役立ちます。Googleのような検索エンジンは、検索結果にパンくずリストを表示することさえあり、これによりクリック率を向上させることができます。
それでは、WooCommerceストアでパンくずリストを有効にする方法を見ていきましょう。2つの方法を説明しますが、ほとんどのユーザーには最初の方法をお勧めします。
- オプション1：AIOSEOを使用してWooCommerceパンくずリストを追加する（SEOフレンドリー）
- オプション2：WooCommerce Breadcrumbsプラグインを使用する（無料でシンプル）
- Frequently Asked Questions (FAQs)
オプション1：AIOSEOを使用してWooCommerceパンくずリストを追加する（SEOフレンドリー）
WooCommerceにパンくずリストを追加する最も簡単で最も強力な方法は、All in One SEOプラグインを使用することです。これは、ストア全体を検索エンジン向けに最適化するのに役立つ最高のWordPress SEOプラグインです。
クリックするだけでSEOフレンドリーなパンくずリストを有効にできますが、このプラグインは、技術的なスキルを必要とせずに、サイトマップからスキーママークアップまですべてを処理します。
WPBeginnerでは、すべてのサイトでAll in One SEOを使用しています。これは市場で最も包括的なツールキットであり、数年前にYoastから乗り換えた理由です。
AIOSEO の完全レビューもお読みになり、当社の経験に関する詳細をご確認ください。
注意: このチュートリアルでは、AIOSEO Pro バージョンを使用します。これはパンくずリストテンプレートが含まれており、カスタマイズのためのより多くのオプションを提供するためです。
パンくずリストが含まれていますが、パンくずリストテンプレートは提供されていない無料版もあります。
まず、AIOSEOプラグインをウェブサイトにインストールして有効化する必要があります。WordPressプラグインのインストール方法については、初心者向けのステップバイステップガイドをご覧ください。WordPressプラグインのインストール方法。
有効化したら、All in One SEO » General Settingsに移動し、ライセンスキーを入力する必要があります。キーはAIOSEOアカウントエリアで見つけることができます。
次に、セットアップウィザードを使用してWooCommerceストアでAIOSEOを設定する必要があります。ヘルプが必要な場合は、WordPressのAll in One SEOを設定する方法に関するガイドに従ってください。
ウェブサイトでプラグインを正しく設定したら、All in One SEO » 一般設定ページに移動し、「パンくずリスト」タブをクリックする必要があります。
その後、「パンくずリストを有効にする」スイッチを切り替えるだけです。これにより、バックグラウンドでパンくずリスト機能がオンになり、AIOSEOは検索エンジンに適したコード（スキーママークアップと呼ばれます）を追加します。
この手順では、サイトにパンくずリストがまだ表示されません。次の手順で、お客様に見てもらえるように表示する方法を説明します。
次に、WooCommerceのパンくずリストをカスタマイズする必要があります。下にスクロールすると、オンラインストアにパンくずリストを追加するさまざまな方法が表示されます。
ショートコードまたはブロックを使用して手動で任意のページまたは投稿に追加するか、ウィジェットエリアに追加できます。上級ユーザーはPHPコードを使用して、テーマテンプレートファイルにパンくずリストを追加することもできます。
以下に、WooCommerceの商品にパンくずリストを追加する方法を説明しますが、その前にカスタマイズオプションを見てみましょう。
💡プロのヒント: 以下の方法を使用する前に、まずテーマの設定を確認することをお勧めします。
多くのモダンなテーマには、AIOSEOと連携するパンくずリストオプションが組み込まれています。これは、サイトのデザインに完全に一致するパンくずリストを追加する最も簡単な方法であることがよくあります。
次に、パンくずリスト設定セクションまでスクロールすると、パンくずリストをカスタマイズするための複数の設定が表示されます。
たとえば、区切り記号を変更したり、ホームページリンクを有効にしたり、パンくずリストのプレフィックスを追加したり、フォーマットを変更したりできます。WooCommerceストアでのナビゲーションリンクの外観のプレビューを確認することもできます。
AIOSEO Proでは、パンくずリストのテンプレートにもアクセスできます。これらは、パンくずリストのナビゲーションパスがどのように構築されるかを定義する「レシピ」と考えてください。
これにより、商品ページ用の異なる構造、ブログ記事用の別の構造などを作成でき、サイト全体でナビゲーションを明確かつプロフェッショナルに保つことができます。
それだけでなく、WordPressプラグインは、テンプレートをカスタマイズするためのさまざまなオプションも提供しています。
たとえば、「デフォルトテンプレートを使用する」オプションを無効にして、その他の設定を表示できます。
ホームページリンク、投稿タイプアーカイブリンク、タクソノミーリンクを表示するオプションがあり、テンプレートにタグを追加したり、カテゴリまたはタグタクソノミーを優先するかどうかを選択したりできます。
複数の商品の親カテゴリを設定している場合は、パンくずリストテンプレートエディタでカスタマイズすることもできます。
完了したら、変更を保存することを忘れないでください。
次に、WooCommerceの商品ページにパンくずリストを追加する必要があります。
AIOSEOは4つの異なる方法を表示しますが、最も簡単な方法は、オンラインストアにパンくずナビゲーションリンクを表示するためにショートコードを使用することです。
パンくずリストを表示したい場所に、次のショートコードを追加するだけです。
[aioseo_breadcrumbs]
これは、特定のページにのみパンくずリストを追加したい場合に最適なオプションです。
これを行うには、商品 » 全商品に移動して商品ページを編集します。次に、WordPressエディタの「テキスト」ビューにショートコードを追加し、ページを更新します。
ただし、ほとんどのユーザーがすべてのページにパンくずリストを表示したい場合は、次に説明するサイドバーウィジェットの方法をお勧めします。これにより、ページを1つずつ編集する手間が省けます。
これで、商品ページにアクセスして、パンくずリストナビゲーションリンクが機能していることを確認できます。
これは、テストウェブサイトでの表示例です。
それに加えて、WooCommerceストアのサイドバーにパンくずリストを追加することもできます。これにより、個々の商品ページを編集してナビゲーションリンクを表示する必要がなくなります。サイドバー全体に表示されるためです。
サイドバーにパンくずリストを表示するには、WordPress管理画面の外観 » ウィジェットに移動できます。
左上にあるプラス記号アイコンをクリックし、「パンくずリスト」と検索して「AIOSEO – Breadcrumbs」ウィジェットを見つけます。サイドバーにドラッグアンドドロップするだけです。ナビゲーションリンクのタイトルを入力することもできます。
それが完了したら、「保存」ボタンをクリックできます。
次に、WooCommerce ストアを表示して、サイドバーにパンくずリストが表示されていることを確認してください。
WooCommerce ストアにパンくずリストを追加する他の方法については、WordPress でパンくずナビゲーションリンクを表示する方法に関するガイドをご覧ください。
複数のカテゴリにパンくずリストを追加する方法
WooCommerceストアに複数のカテゴリを持つ製品がありますか？
はいの場合、WordPressはお客様が商品ページにたどり着いた経路を記録しないため、パンくずリストを正しく設定するのは難しい場合があります。
ただし、AIOSEOは自動的に最初のカテゴリをパンくずに追加し、複数のカテゴリを持つ製品の正しいナビゲーションメニューを簡単に表示できます。
このプラグインは、製品カテゴリのようなWordPressのタクソノミー用にカスタマイズできるパンくずリストテンプレートも提供します。行う必要があるのは、All in One SEO » 一般設定に移動し、「パンくずリスト」タブを選択することだけです。
次に、「パンくずリストテンプレート」セクションまでスクロールし、「分類」タブを選択します。デフォルトでは、プラグインはWooCommerceストアのパンくずリストに親アイテムのリンクを表示します。
「デフォルトテンプレートを使用する」オプションを無効にすると、「親アイテムリンクを表示する」が有効になります。これにより、ウェブサイト上のあらゆる商品に対して、プライマリカテゴリを簡単に表示できます。
例えば、オンライン靴店を経営していて、ある製品がスニーカーとトレーナーの両方のカテゴリに属しているとします。
AIOSEOは自動的に最初のカテゴリを選択します。
次に、それをパンくずナビゲーションメニューに表示します。
オプション2：WooCommerce Breadcrumbsプラグインを使用する（無料でシンプル）
WooCommerce でパンくずリストを有効にする別の方法は、WooCommerce Breadcrumbs プラグインを使用することです。
これは、オンラインストアにパンくずリストを追加できる無料の WordPress プラグインです。このプラグインは使いやすいですが、AIOSEO にあるようなカスタマイズ機能は不足しています。
まず、WooCommerce Breadcrumbs プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法に関するチュートリアルを参照してください。
プラグインがアクティブになったら、WordPress管理エリアから設定 » WC Breadcrumbsに移動できます。その後、「パンくずリストを有効にする」のチェックボックスをクリックしてください。
次に、WooCommerceストアに表示されるナビゲーションリンクの外観を変更できます。
WooCommerceプラグインを使用すると、パンくずリストの区切り記号と、パンくずリストの前後のHTMLタグを選択できます。
次に、下にスクロールすると、カスタマイズのためのさらに多くのオプションが見つかります。たとえば、ナビゲーションリンクに表示されるホームページのテキストとURLを変更できます。
変更が完了したら、一番下にある「変更を保存」ボタンをクリックするのを忘れないでください。
よくある質問 (FAQ)
WooCommerceにパンくずリストを追加することについて、読者からよく寄せられる質問をいくつかご紹介します。
すべてのWordPressテーマはWooCommerceのパンくずリストをサポートしていますか？
多くのモダンなテーマ、特にWooCommerce向けに構築されたテーマには、独自のパンくずリスト機能が含まれています。ただし、その表示や設定は限定的である場合があります。
All in One SEOのような専用プラグインを使用すると、より多くの制御が可能になり、どのテーマを使用してもパンくずリストが検索エンジンに最適化されていることが保証されます。
パンくずリストのスタイルと外観を変更できますか？
はい。AIOSEOのようなプラグインを使用すると、設定メニューから区切り文字、テキスト、プレフィックス、その他の表示オプションを簡単に変更できます。
より詳細な視覚的な変更のために、カスタムCSSを適用して、パンくずリストをサイトのブランディングやデザインに完全に一致させることもできます。
パンくずリストはSEOにとって重要ですか？
もちろんです。パンくずリストは内部リンクを作成し、Google のような検索エンジンがサイトの階層と構造を理解するのに役立ちます。
Googleは検索結果にパンくずリストを直接表示するため、リスティングの外観が向上し、クリック率が向上する可能性があります。
あなたが気に入るであろう、さらに多くのWooCommerceのヒント
この記事で、WooCommerceにパンくずリストを追加する方法を学べたことを願っています。WooCommerceに関連する他のガイドも参照してください。
- WooCommerceでスマートな製品検索を作成する方法
- WooCommerce製品のフィルタリング方法（ステップバイステップチュートリアル）
- WooCommerceショップページのタイトルを変更する方法（簡単＆迅速）
- WooCommerceで商品SKUによる検索を有効にする方法
- WooCommerceに商品タグ、属性、カテゴリを追加する方法
- WooCommerceで商品IDを見つける方法（初心者ガイド）
- WordPress に GTIN、ISBN、MPN スキーマを追加する方法
- WooCommerceの商品検索が機能しない場合の対処法
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
質問や提案はありますか？コメントを残して、議論を開始してください。