WordPressでブレッドクラムナビゲーションリンクを表示する方法

公開: 2020-08-07

サイト訪問者がWebサイトをナビゲートする機能は、そのUXで重要な役割を果たします。 あなたはあなたのウェブサイトに着陸する誰もが即座にウェブサイトの主要な構造の感覚をつかむことを確実にする必要があります。 そうしないと、バウンス率が上がり、潜在的なリードを失うリスクがあります。 このタイプの問題を回避する方法の1つは、ブレッドクラムナビゲーションを使用することです。 ブレッドクラムは、UXを通じてウェブサイトの全体的なパフォーマンスを向上させると同時に、WPウェブサイトのSEOに貢献することができます。 この記事では、WordPressでパンくずリストのナビゲーションリンクを表示する方法を詳しく見ていきます。

ブレッドクラムナビゲーションとは何ですか?

  • ブレッドクラムナビゲーションは、階層的なナビゲーションメニューを表すリンクの軌跡です。 これは、サイトの階層内でのページの位置に関する情報をユーザーに提供するセカンダリナビゲーションシステムとして機能します

ブレッドクラムが行うことは、ユーザーをホームページに戻すためのトレイルを作成することです。 これは、ユーザーが他のページに簡単に移動できる必要がある特定のサイトで特に役立ちます。オンラインストアはその明白な例です。 ただし、SEOに関しては、ブレッドクラムナビゲーションは、検索エンジンがWebページの階層と構造を理解するのに役立ちます。 さらに、パンくずリストがGoogleの検索結果に表示されるため、ウェブサイト全体の視認性が高まります。

WordPressでブレッドクラムナビゲーションリンクを追加および表示する方法

WordPressでブレッドクラムナビゲーションリンクを追加して表示するのは難しくありません。 したがって、初心者でもコーディングの専門家でも、いくつかの簡単な手順でこれを実行できるはずです。 これを行う方法は他にもあるので、さまざまなプラグインを使用してブレッドクラムを追加および表示する方法を示します。

ブレッドクラムNavXTプラグイン

このタイプのナビゲーションをWordPressサイトに追加する最も簡単な方法は、BreadcrumbNavXTプラグインです。 ご存知のように、WordPressプラグインはさまざまな目的に使用できます。 プラグインを使用して、サイトのクローンを作成または複製したり、ソーシャルメディアやその他の目的で使用したりできます。 ただし、ブレッドクラムナビゲーションに関しては、 NavXTは、ナビゲーションシステムの配置に使用されるWordPressウィジェットを提供する人気のあるプラグインです。 豊富なオプションにより、ユーザーのナビゲーションをカスタマイズできます。

最初に行う必要があるのは、BreadcrumbNavXTプラグインを検索してインストールすることです。 完了したら、左側の管理パネルをクリックして[新しいオプションの追加]を選択すると、メインの設定ページが表示されます。 デフォルト設定は、ほとんどのWebサイトで機能するはずです。 さまざまなタブがあり、それぞれがWebサイトに適したさまざまな設定を提供します。

  • [一般設定]タブで、Webサイトのプラグインのグローバル設定を決定できます。
  • [投稿の種類]タブは、投稿とページのブレッドクラムリンクを個別に設定できるため、非常に重要です。
  • [分類法]タブでは、適切と思われるカテゴリを設定でき、リンク用の同様のテンプレートを見つけることができます。
  • [その他]タブでは、作成者の設定を変更できます。
  • あなたがあなたのウェブサイトに最も役立つと思う変更を加えてください、そして、変更を保存するために「変更を保存する」ボタンをクリックすることを忘れないでください。

あなたのウェブサイトにパンくずリストを表示する

WordPressでブレッドクラムナビゲーションリンクを表示するには、[外観]に移動して[カスタマイズ]を選択する必要があります。 そこで、[位置]ドロップダウンでブレッドクラムの位置を選択できます。 また、BreadcrumbSourceでBreadcrumbNavXTを選択する必要があります。

YoastSEOプラグイン

もう1つの人気のあるプラグインはYoastSEOで、検索エンジンのランキングを概算してコンテンツを最適化するのに役立ちます。 ただし、Webサイトの可視性を高めるために使用される機能がいくつかあり、WordPressでブレッドクラムリンクを追加および表示するために使用することもできます。

SEO。
YoastSEOにはまだまだあります

最初に行う必要があるのは、パンくずリストを配置する場所を決定することです。 それに応じて、次のコードを目的の場所に追加する必要があります。

  • <?php
  • if(function_exists('yoast_breadcrumb')){
  • yoast_breadcrumb('<p id =” breadcrumbs”>'、'</ p>');
  • }
  • ?>
コード。WordPressでパンくずリストのナビゲーションリンクを表示するために必要な場合があります。
WordPressでブレッドクラムナビゲーションリンクを表示するためにコードが必要になる場合があります

YOASTSEOでブレッドクラムナビゲーションリンクを表示する方法

テーマとアップデートによっては、コードが上書きされる可能性があります。 その場合は、テーマ開発者に連絡する必要があります。 スニペットを配置したら、SEOに移動し、[検索]を選択して、[ブレッドクラム]をクリックします。 ブレッドクラム設定でブレッドクラムを有効にします。 サイトをプレビューすると、Webサイトの目的の部分にパンくずリストの場所が表示されるはずです。

フレキシブレッドクラム

Flexy Breadcrumdは、WordPressでブレッドクラムを追加するために使用できるプラグインの1つです。 プラグインをインストールしてアクティブ化すると、[flexy_breadcrumb]ショートコードを使用してブレッドクラムを追加できるようになります。 WordPressのショートコードに慣れていない場合は、ショートコードをよりよく理解するのに役立つ資料がたくさんあります。

ダッシュボードのサイドバーに、FlexyBreadcrumbアイテムが表示されます。 それをクリックすると、ホームページを変更できる設定が表示されます。アイコンとテキストを変更し、文字数制限と階層を設定します。 [タイポグラフィ]タブでは、パンくずリストのフォントサイズと色を変更できます。 トレイルのカスタマイズが完了したら、ブレッドクラムを配置する場所に上記のショートコードを追加します。

WooCommerceブレッドクラム

クライアントが製品ページ間を簡単に移動できるようにブレッドクラムが必要な場合は、WooCommerceブレッドクラムのインストールを検討してください。 すでにWooCommerceプラグインを使用しているので、これが最も簡単なオプションです。

プラグインをインストールしてアクティブ化し、[設定]に移動してWCブレッドクラムを見つけます。 ブレッドクラムを有効にすることを忘れないでください。 次に、製品ページを選択できます。

今日からウェブサイトのUXの改善に取り組み始めましょう

WordPressでブレッドクラムナビゲーションリンクを追加して表示する方法を知っているのは良いことです。 ただし、有名なおとぎ話も覚えておく必要があります。パンくずリストを使用している場合でも、道に迷うことがあります。 そして、これはあなたがあなたの訪問者に起こりたいことではありません。 このシステムは、あなたのウェブサイトへの強力な追加のように感じられ、訪問者があなたのウェブサイトの構造を即座に理解できるようにする場所に配置する必要があります。 結局のところ、訪問者のエクスペリエンスを向上させたいので、訪問者のことを頭に入れておくことが重要です。