プラグインPS Auto Sitemap設置方法!ページ一覧表示するHTMLサイトマップは、カテゴリごとに自動出力

ブログを訪問したユーザーにとって利便性として、カテゴリ分けした投稿ページ一覧のサイトマップを簡単に固定ページに設置するWordPressプラグインの設置方法。

設置後にCSSでスタイルを変更して、スマホでタップしやすく・PCでも見やすいように文字サイズなど最後に見出しを置いてます。

HTMLサイトマップとXMLサイトマップの違いから、設置方法・スタイルの変更と順番にチェックしてくださいね^^

サイトマッププラグイン

サイトマッププラグイン※プチカスタマイズ済み

スポンサーリンク

ユーザー用のHTMLサイトマップ?XMLサイトマップとの違いは何!?

HTMLサイトマップとXMLサイトマップ2つの違い

XMLサイトマップはクローラー用、検索エンジン用に更新を伝えるに伝える為のリンクです。HTMLサイトマップはユーザーがどんなページがあるか一覧で見るものだから、パッと見て解るものでなければいけません。

LINKGoogle XML SitemapsでXMLサイトマップ送信!検索エンジンに情報を伝える為にプラグインで登録

下記画像がユーザー用サイトマップの画像です。どのカテゴリに何があるか?っと、すぐに見てわかりますね。

ユーザー用のサイトマップ例

ポイント
  • XMLサイトマップ
    • クローラー・検索ロボットが巡回しやすいサイトマップ
  • HTMLサイトマップ
    • ユーザーのための用サイトマップ

カテゴリごとに分けた投稿ページをユーザーに伝える

ページを更新するときカテゴリに分けることで、ユーザーが欲しい情報を見つけやすくなります。欲しい内容を大きなカテゴリに分けて、更に子カテゴリに分け探しやすくするのがベストです。

食べ物のカテゴリの中に、WordPressのことを入れてると、どうでしょう?

ユーザーさんの期待に添えない情報が入ってると、どんなに良い内容を書いていてもキチンと届ける事ができません。

欲しい情報を解りやすく、探しやすくする為のサイトマップですから、カテゴリ分けは当然必要です。検索エンジンに伝えるのは、ユーザーが欲しい興味のある情報をキーワードに合わせて書いたり表示すること為ですから。

LINK初心者が解るSEO!検索エンジンの仕組みから説明しよう!

ユーザーにページ一覧を見てもらうのがサイトマップ、さらにテーマの設定によっては、カテゴリがSEOで重要な役割も持つので、プラグインを使ってサクッと設置していきましょう。

HTMLサイトマップのプラグイン「PS Auto Sitemap」設置

サイトマップのスタイル変更が簡単にでき、14種類のテンプレートがあります。プラグインなのでテーマを変えても表示されるし、スタイルの変更もチェックを入れて更新するだけでできちゃいます。

インストール方法は、ダッシュボードのプラグインから新規追加を選択します。

  1. プラグインの検索窓より
  2. 「PS Auto Sitemap」と入力
  3. 「今すぐインストール」をクリック。
  4. 「有効化」

WordPressの固定ページにサイトマップを作成

インストール後に、設定が必要になりますので一緒にやっていきましょう。

  1. ダッシュボード内『固定ページ』から『新規追加」を選択しサイトマップ専用ページを作成。
  2. 【ビジュアル】【テキスト】と右側にあるタブ。【テキスト】をクリックしてHTML下記コードを、白い画面にコピペします。

PS Auto Sitemap固定ページでサイトマップの設置する方法

  1. タイトルには「サイトマップ」
  2. パーマリンクは「sitemap」

以上で、【公開】をクリック!

サイトマップ用、固定ページの記事IDを入力

サイトマップを表示する記事を作った、固定ページの記事IDである数字を調べ記入します。

ダッシュボードより『固定ページ』を開くと『サイトマップ』の下に『編集』という項目にマウスポインタを合わせてください。▼下記画像の通りです。

サイトマップのID 確認方法

画面左下に、数字が出てきます。それが、あなたの作ったサイトマップのIDで私の場合308がID。

admin/post.php?post=数字&action=edit

その数字をメモして覚えたら【PS Auto Sitemap】へ戻ります。

  • ダッシュボードの設定より
  • PS Auto Sitemapをクリック

『サイトマップを表示する記事』に「さっきの数字」を入れたら、サイトマップとして記事を出力します。

PS-Auto-Sitemapの設定

サイトマップを表示する記事欄に数字を入れる

PS Auto Sitemapのその他の設定

PS Auto Sitemapの説明画像1

PS Auto Sitemap設定

上から順番に説明すると下記。

  • 【ホームページの出力】
    • 【ブログ名】が不要なら、「レ点」をチェックを解除。
    • 個人的にヘッダーにブログ名が書いてるのでチェックは外してます。
  • 【投稿リスト】
    • 普段投稿している記事。必要なので出力!
    • 【出力】は、【表示】と置き換えると一気にわかりやすい。
  • 【固定ページ】
    • Aboutブログについて、Cntact formお問い合わせページなど
    • ダッシュボードの固定ページから作成したページを出力するかどうか。
  • 【出力階層制限】
    • カテゴリの階層を制限するか
  • 【先に出力するリスト】
    • 投稿ページを先にするなら、投稿にチェック!
  • 【カテゴリーと投稿の表示】
    • 同一のほうは1度にすべてのページが表示されるので、同一マップ内にしてます。

PS Auto Sitemap2

  • 【除外記事】
    • 表示させたくない記事のIDなど。サイトマップがクロールされた時、noindexの記事をクロールされたくない場合IDを入れる
    • 記事IDはさっきの方法と同じ
  • 【スタイルの変更】
    • 14種類、好みでどうぞ
  • 【キャッシュの使用】
    • キャッシュは一度読み込んだページを保存しておく、読み込みの時短です。個人的に切ってます^^

設定が終われば、【変更を保存】をお忘れなく。

サイトマップのスタイルをCSSで変更

サイトマップのスタイル:カスタマイズ前。字が詰まって見にくい

せっかく設置したサイトマップですが、字が小さくスマホではタップしにくいのが現状なので、CSSでスタイルを変更して見やすくします。

サイトマップのスタイル変更後

サイトマップのHTMLは番号なしのリストulタグで作られてます。テーマの番号なしulタグの装飾によって間隔などは変わるけど、基本的に見やすく装飾してたのでコピペでWordPressダッシュボード内、外観よりテーマの編集でスタイルシートに追記してくださいね^^

説明はスタイル横に/*コメント*/している通りです。

2~5行目はコメントアウトしています。ul番号なしリストの装飾を追加するひとはコメントアウト/**/を削除してください。

  • 4行目は画像を使用した場合、リスト前の画像を消す記載。
  • 3行目は記号やアイコンフォント前のリストマークを消す記載です。

リストの装飾をすることでより見やすくなるので、興味があればコピペでカスタマイズして、2行目/*と5行目*/のコメントを削除してくださいね^^

LINK番号なしulリストを記号・マーク・画像で装飾!CSS初心者が応用できるカスタマイズ説明あり

さいごに

サイトマップは、XMLサイトマップ検索エンジン用、HTMLサイトマップ訪問者用とがあります。どちらも、欠かさず設置しましょう!

記事更新するとサイトマップを、自動で追加生成してくれるので手放せないですよね。人用、クローラー用どちらも設置すれば、あとは放置で大丈夫!

WordPressの脆弱性をついた攻撃が日々行われてるのが現状ですので、プラグインの更新もチェックしてきましょう。

LINK簡単にセキュリティ対策ができる!SiteGuard WP Pluginの設定方法と詳細

それでは、かうたっくでした。

スポンサーリンク

シェアする

フォローする

  • Follow Me →
トップへ戻る