WordPress

[WordPress]HTMLサイトマップを自動で作成する方法

この記事は 6 分17秒くらいで読めます。

ブログやサイトで記事数が増えてくると、昔にアップしたものがどんどん下層に下がっていき、訪問してくれた方の目に留まりにくくなりますよね。そんなとき、サイトの目次のようなものがあれば便利だと思いませんか?

今回はごぶろぐのサイトマップのように「HTMLサイトマップ」を簡単に作成する方法をご紹介します。

この記事を読んで欲しい人
  • 「HTMLサイトマップ」「XMLサイトマップ」の違いを知りたい
  • WordPressで簡単に「HTMLサイトマップ」を作りたい
  • ブログ記事の一覧ページを作りたい
  • 埋もれている記事を訪問者に読んで欲しい

「HTMLサイトマップ」「XMLサイトマップ」の違い

「HTMLサイトマップ」って?

「HTMLサイトマップ」とは、下の図のように、カテゴリー別にリンク付きの記事一覧を表示するページのことです。

[WordPress]HTMLサイトマップを自動で作成する方法

「HTMLサイトマップ」は訪問者の為のサイトマップです

「XMLサイトマップ」って?

「XMLサイトマップ」は検索エンジンのクローラーに向けて作成されたもので、サイト内に存在するURLのリストを作り、情報を検索エンジンへ送ります。まだ設定していない人はこの機会にぜひ設定しましょう。SEOを気にしたブログの書き方の記事で詳しい方法を説明しています。

[WordPress]HTMLサイトマップを自動で作成する方法
初心者ブロガーが気を付けた6つの項目自分のブログで体験した「可能な限り早めに設定したほうがいい」SEO対策。失敗談も含めておすすめの方法や参考サイトをご紹介。...

「XMLサイトマップ」は検索エンジのクローラーの為のマップです

「HTMLサイトマップ」「XMLサイトマップ」の比較

種類誰のため?目に見える?役割は?
HTML
サイトマップ
訪問者目次
XML
サイトマップ
クローラー×SEO対策

WordPressプラグイン『PS Auto Sitemap』を使って自動でHTMLサイトマップを作成

[WordPress]HTMLサイトマップを自動で作成する方法
それではここからはプラグインを使って、自動でHTMLサイトマップ(目次)を作成する方法を説明するよ。自動で作成されるので、設定さえしておけば、記事が増えるごとに目次を修正する…なんて必要はないよ

『PS Auto Sitemap』の設定方法と使い方

  1. 「プラグイン」→「新規追加」で『PS Auto Sitemap』を検索し、インストール後有効化します[WordPress]HTMLサイトマップを自動で作成する方法
  2. 「固定ページ」を選択し「新規追加」します[WordPress]HTMLサイトマップを自動で作成する方法
  3. サイトマップや目次など分かりやすいような名前をつけます[WordPress]HTMLサイトマップを自動で作成する方法
  4. 固定ページのHTMLモード(テキストモード)で以下のコードを入力します。<!– SITEMAP CONTENT REPLACE POINT –>[WordPress]HTMLサイトマップを自動で作成する方法
  5. 「公開」を押し「プレビュー」を押すと、URLが表示される欄に

    自分のサイトURL/固定ページ名?preview_id●●●&preview

    と表示されるので、preview_idの後ろの数字をメモしておきます。
    ↓の場合なら 3150 です。
    [WordPress]HTMLサイトマップを自動で作成する方法

  6. 「設定」→「PS AutoSitemap」を選択し、下の図のように設定します。[WordPress]HTMLサイトマップを自動で作成する方法・サイトマップを表示する記事:⑤でメモした固定ページのID・出力階層制限:こちらに制限を設けると、カテゴリー名のみの表示にもできます。制限なしの場合は記事名も表示されます。・スタイルの変更:スタイルについては次の項でサンプルをご紹介します。
  7. 「変更を保存」を押して終了です。

『PS Auto Sitemap』のスタイルサンプル一覧

スタイルが沢山あるので、サンプルをご紹介します。こちらは全て同じ大きさでの画像となっています。文字の大きさが違うのはそれぞれのスタイルに依存しています。

[WordPress]HTMLサイトマップを自動で作成する方法
私はWordPressのテーマjinを利用していますが、テーマによっては『PS Auto Sitemap』で作成したサイトマップに干渉してしまう場合があります。jinを利用している方は、サイトマップの項目の前に「・コンマ」がつきます。こちらを修正するのはテーマを修正する必要があるそうなので、私はこのまま利用しています
[WordPress]HTMLサイトマップを自動で作成する方法
前に下手にさわってひどい目にあったもんな

スタイルの変更で好きなスタイルを選んでください

[WordPress]HTMLサイトマップを自動で作成する方法
シンプルシンプル2チェックリスト蛍光ペンドキュメントツリー付箋音譜矢印ビジネス索引アーバンアンダースコアキューブチェックリスト
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
[WordPress]HTMLサイトマップを自動で作成する方法
ごぶろぐのサイトマップで使っているスタイルは『索引』だよ!これなら・コンマがそこまで邪魔にならないね!