WordPressで目次(記事一覧ページ)を作る方法

今回はWordPressで目次(記事一覧)ページを作る方法、つまりサイトマップ作成ですね。

このブログでも目次ページは作っていますが、訪問者にどのような記事があるのか?という事を一覧で見せる事ができますし、ズラリと並んだ記事記事タイトルの横にアイコンを付ける事で読んでもらいたい記事に誘導するって事も可能です。例えばこんな感じ。
WordPressまとめページ 

という訳で今回は目次ページを作ってみましょう。

スポンサーリンク

目次ページを作る前に

さて、これは私の場合ですが、WordPressで目次ページを作る時には普通の「投稿」ではなく、「固定ページ」として作成する事もあります。理由は固定ページはどのカテゴリーにも属さないから。

別に「投稿」でも問題はありませんが、投稿で作成してしまうと新しい記事を作成する度にどんどん埋もれていってしまいます。

それよりも目次ページ固定ページで作成してこれを「トップページに固定する」方法もあります。固定ページで作成してトップページに固定する方法までを今回は紹介していきます。

プラグインは使わない方がいい?

サイトマップ(記事一覧)を自動で取得して一覧表示するプラグインもあります。

確かに便利で簡単です、しかしながら、書いた記事がすべて自信作という訳ではありませんので、できればプラグインは使わずに読んでもらいたい記事だけをピックアップして目次を作成する事をおすすめします。

その方がPV(ページビュー)が増えますし、お気に入り登録やブックマークしてもらえる可能性が高いと思ってます。そう思いません?

手動で目次ページを作成する手順

目次ページを作る場合は箇条書きのタグ、リストタグというのを使いますので、ビジュアルエディタではなく、テキストエディタ(タグ編集)エディタで作ると失敗しないと思います。投稿画面で「テキスト」エディタを選択します。

目次-1

それで記事作成画面で目次作成用のタグを記入して行きます。

こんな感じです。

目次-3

「#」の文字の所に、ボタンクリック時にジャンプするページのURLを(#を消して)書き込みます。それから「記事1」から「記事5」には、表示する文字(記事タイトル)を記入。一応5つ書いて見ましたが、同じように「li」と「/li」で囲んで追加してもOK、減らしても大丈夫です。

これが基本的な部分です。後は見出しタグで見出しを作っていきます。このTwentyTwelveの場合は記事タイトルが「h1」という見出しタグになってますので、記事内に使う見出しタグは「h2」や「h3」を使います。これは使っているテーマによって違いますので確認しておくといいでしょう。

こんな感じに使います。

するとこのように表示されます。

目次-2

見出しの装飾は以前の記事「WordPress見出しの使い方とカスタマイズ」を参考にして下さい。

このようにしてそれぞれ見出しと記事一覧を入れながら目次ページを作成できます。

作った目次ページをトップページに固定する方法

作成した目次ページをトップページに固定したい場合は次の手順で固定する事ができます。WordPressの管理画面から「設定」⇒「表示設定」をクリックします。

目次-4

ここ「フロントページの表示」という項目がありますので、「固定ページ」にチェックを入れてトップに表示したい固定ページを選択して下さい。固定ページを作成していない場合はこの項目は表示されません。

目次-5

選択したら一番下の「変更を保存」をクリックしたら完了です。トップページには先ほどしていたページが表示されているはずです。

最終更新日:2016/02/26

WordPressで目次(記事一覧ページ)を作る方法”に11件のコメントがあります。

コメントの反映には時間がかかる場合があります。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

  1. シン

    しげぞうさん。

    テキストでカテゴリーを自作するっていう方法思いつきませんでした。ありがとうございます。

    今僕はsimplicity2というテーマを使っています。

    また質問するかもしれませんがよろしくお願いします。

  2. しげぞう 投稿作成者

    シン様

    コメントありがとうございます。私のブログの場合は各カテゴリーの最新記事に目次ページを作成しています。カテゴリーの目次の場合は固定ページではなくて、普通の投稿で目次を作成して、それをカテゴリーの中で一番最新の日付にしてますので、カテゴリーをクリックすると目次ページが最初に表示されるような感じです。

    これは結構面倒な部分があって、記事を追加したらそのカテゴリーの目次ページを再度最新の日付にする必要がありますし、カテゴリーの最新記事だけ全文表示にするカスタマイズもしております。一応私の使っているテーマTwenty Twelveでの実装は記事にしてますが、他のテーマで使えるかどうかは検証はしてませんので、シン様のお使いのテーマを教えて頂けると助かります。

    WordPressでカテゴリーの最新記事だけ全文表示させる方法

    簡易的にするのであればもう1つ方法があります。先に各カテゴリーの目次ページを作成しておいて(固定ページでも投稿でもOK)サイドバーのウィジェットから「カテゴリー」を外します。

    それでサイドバーに新たに「テキスト」を追加して、タイトルに「カテゴリー」と入力。内容にはカテゴリーの目次ページへのリンクを羅列する方法です。こんな感じです。

    カテゴリー1~5にはそれぞれのカテゴリー名を入れて「#」の部分に飛び先URL(各カテゴリーの目次ページへのリンク)を設置するという方法です。

    要は本当のカテゴリーではなくて、カテゴリーの目次へ飛ばすリンクを設置する方法になります。

    普通のカテゴリーの場合は記事の一覧が表示されますが、上記の「簡易的なカテゴリー」の場合は表示されるのが目次ページ1ページだけになりますが、似たような感じにはなるかなと思います。

  3. シン

    しげぞうさん。はじめまして。

    現在、wordpressを使ってサイトを作っているのですがどうにかしてカテゴリーを目次付きの固定ページにリンクさせたいです。

    今の僕のサイトだと、カテゴリーを押した場合そのカテゴリーの記事が新しい順に出るのですがこのサイトのように目次ページにリンクする方法がわかりません。

    よろしくお願いします。

  4. LaLa

    先ほどコメントを送りました、LaLaです。
    URLの件、解決しました。一つだけ目次ページからURLに飛びませんが。。
    さっきは、本当に焦ってしまって、慌ててしげぞう様に質問してしまいましてお騒がせしました。
    今だに自分にとっての新しい試みはドキドキしながらやっています。また分からない事が出て来たら質問させてください。
    失礼しました。

  5. LaLa

    LaLaです。
    固定ページに目次を作っていたのですが、「#を消してURLを入れる」とありますが、投稿ページのURLですか?よくわからずにやっていたら、とび先が全部WordPressのログインページに飛ぶ様になってしまいまして、焦っています。
    どこに表示してあるURLを入れたらよかったのでしょうか?
    パーマリンクですか?