WordPressでカスタムアーカイブページを作成することで、サイトのナビゲーションとコンテンツの発見性を大幅に向上させることができます。
WPBeginnerでは、読者がブログ投稿やチュートリアルの膨大なコレクションに簡単にアクセスできるように、独自のカスタムアーカイブページを実装しました。
優れたデザインのアーカイブページは、ユーザーエクスペリエンスを向上させ、エンゲージメントを高め、明確なサイト構造をプロバイダーすることでSEOにも役立ちます。コンテンツが豊富なサイトやブログ、オンラインマガジンなど、訪問者が特定のトピックを掘り下げたがるような場合に便利です。
この投稿では、WordPressでカスタム・アーカイブ・ページを作成する方法を紹介する。
WordPressでカスタムアーカイブページを作成する理由
アーカイブページは、過去の投稿を時系列で表示することで、訪問者が投稿日に基づいてコンテンツを探索しやすくすることを目的としています。
ブロガーなら、アーカイブページを持つことは必須だ。ユーザーがブログ全体をスクロールすることなく過去の投稿にアクセスできる便利な方法を提供します。
現在のテーマにアーカイブページテンプレートがない場合、カスタマイザーでアーカイブページを作成することができます。たとえそうだとしても、あなたのニーズに合わせてカスタマイズしたいかもしれません。
WPBeginnerでは、ユーザーをWPBeginnerガイドコレクションに導くボタンを備えたカスタムアーカイブページを使用しています。こうすることで、新規読者はそれをクリックするだけで、私たちの究極のガイドリソースを見ることができます。
また、読者が特定の期間にどのような記事が公開されたかを簡単に確認できるように、ブログの投稿をすべて年や月ごとに整理しています。
ここでは、カスタムアーカイブページにサイトのカテゴリーとタグも追加しています。
こうすることで、訪問者は興味のありそうな過去の投稿を簡単に見つけることができる。自分のブログでもこのようにすれば、ページビューを増やし、直帰率を下げるチャンスが増えるだろう。
このことを念頭に置いて、WordPressでカスタムアーカイブページを作成する方法を見てみましょう。
以下のクイックリンクから、使いたい方法に直接ジャンプできます。
方法1:ブロックエディターを使ってカスタムアーカイブテンプレートを作成する(プラグインなし)
ブロックテーマを使用している場合は、フルサイトエディターでカスタムアーカイブページテンプレートを簡単にデザインできます。
この方法はすべてのテーマで機能するわけではないので、ブロックベースのWordPressテーマを使用していない場合は、代わりにページビルダーを使用することをお勧めします。
まず、新規ページを作成するか、アーカイブとして使用したい既存のページを開きます。右側のメニューで「ページ」タブをクリックし、「テンプレート」の隣にあるリンクを選択してください。正確なリンクテキストは、現在使用しているテンプレートによって異なる場合があります。
現在のテンプレートがポップアップで表示されます。
新規テンプレート」アイコンをクリックしてください。
ポップアップで、カスタムページテンプレートの名前を入力します。テンプレート名は参考用ですので、お好きなものをお使いください。
次に、’Create’をクリックしてテンプレートエディターを起動する。
テンプレートエディターは、WordPressの標準ブロックエディターと同様に機能します。
カスタムアーカイブページにブロックを追加するには、青い「+」ボタンをクリックするだけです。あとはドラッグ&ドロップでブロックをレイアウトに追加できます。
カスタムアーカイブページを作成するので、通常アーカイブブロックを追加することから始めます。このWordPressブロックは、訪問者が年、月、週、日に基づいて投稿を探索することができます。
例えば、次の画像は投稿が月ごとのアーカイブに整理されているアーカイブブロックを示しています。
これらのリンクをクリックすると、その期間に公開されたすべての投稿を表示する新しいページに移動します。
アーカイブブロックを追加するには、左側のメニューからブロックを探し、レイアウト上にドラッグするだけです。ブロックを追加したら、右側のメニューでブロックの設定を見てください。
手始めに、「Group by」ドロップダウンを開き、リストから設定を選択することで、投稿の整理方法を変更することができます。
例えば、投稿数が少ない場合は、日別に表示するのが合理的でしょう。
しかし、コンテンツがたくさんある場合は、長いリストで訪問者を圧倒しないように、「月」や「年」を選択するのが一般的です。
WordPressは初期設定でアーカイブ投稿を箇条書きリストで表示しますが、ドロップダウンメニューとして表示することもできます。
これは、スペースが非常に小さく、コンパクトなアーカイブを作成する必要がある場合に便利です。ドロップダウン形式に切り替えるには、「ドロップダウンとして表示」スライダーをクリックして有効化するだけです。
アーカイブブロックでは、各見出しの次の投稿数の合計を表示することもできます。
これは、訪問者がアーカイブのどの部分を最初に見たいかを決めるのに役立つ。
また、カテゴリーアーカイブを追加することで、訪問者が投稿日だけでなく投稿コンテンツに基づいて投稿を探せるようにすることもできます。こうすることで、訪問者が興味深いコンテンツを見つけやすくなり、サイトに長く滞在してもらい、WordPressのSEOを向上させることができます。
このブロックを追加するには、青い「+」ボタンをクリックし、「カテゴリーリスト」とタイプするだけです。適切なブロックが表示されたら、ドラッグ&ドロップでレイアウトに追加します。
もう一度、ブロックの設定に変更を加えたいかもしれない。
アーカイブブロックと同様に、投稿数をリストに追加したり、カテゴリーを箇条書きリストではなくドロップダウンメニューとして表示することができます。
初期設定では、このブロックはすべてのカテゴリーとサブカテゴリーをまったく同じように表示する。
子カテゴリーを親の下にインデントして表示する方がいいかもしれない。
この変更を行うには、クリックして「階層を表示」トグルを有効化するだけです。
もう一つのオプションは、’Show only top level categories’トグルを有効化して、子カテゴリーを完全に非表示にすることである。
また、タグクラウドを追加することで、訪問者が興味深い関連コンテンツを見つけやすくなります。これを行うには、左側のメニューで「タグクラウド」を見つけ、レイアウトにドラッグするだけです。
これでブロックを選択し、右側のメニューにある設定を使って設定することができます。
タグクラウドには2つのスタイルがあります:初期設定とアウトラインです。小さな丸いアイコンをクリックし、「スタイル」の下にあるオプションのいずれかを選択することで、これらを切り替えることができます。
また、各タグの次の投稿の総数を表示したり、クラウドに含まれるタグの数を変更することもできます。
小さな歯車のアイコンをクリックし、このセクションで変更を加えます。
この名前にもかかわらず、タグクラウドにカテゴリーを表示することもできます。例えば、カテゴリーブロックよりもタグクラウドブロックの方がスタイリングが好みかもしれません。
代わりにサイトのカテゴリーを表示するには、「タクソノミー」ドロップダウンを開き、「カテゴリー」を選択するだけです。
アーカイブは、訪問者がすべてのコンテンツに簡単にアクセスできるように設計されています。
しかし、「最新の投稿」ブロックを追加することで、サイトの最新の投稿を強調することもできます。
初期設定では、このブロックは各投稿のタイトルを表示するだけですが、投稿者、公開日、アイキャッチ画像を追加することができます。
右側のメニューにあるトグルを使って変更する。
また、投稿の抜粋を表示することで、訪問者が各投稿の内容を理解しやすくなります。
抜粋を追加するには、「投稿コンテンツ」トグルをクリックして有効化する。
その後、「抜粋」ボタンをクリックして選択する。
初期設定では、WordPressは抜粋に最大55語を表示します。より多くの単語を表示したり、より少ない単語を表示したりするには、単に「抜粋の最大単語数」の設定を使用します。
そうしたら、「ソートとフィルター」セクションまでスクロールする。
ここでは、ブロックが投稿を新しいものから古いものへと整理していることがわかります。Order’ ドロップダウンを開き、’A-Z’ などの別の設定を選ぶことで変更できます。
このセクションでは、特定の投稿者やカテゴリーからの投稿を表示することもできます。
最後に、WordPressがブロックに表示する投稿数を変更するには、「項目数」セクションに新しい数字を入力するか、スライダーをドラッグします。
さらにブロックを追加し、右側のメニューで設定することで、アーカイブページの作業を続けることができます。
例えば、画像ブロックを追加してカスタムロゴを表示したり、検索バーを追加して訪問者が特定の投稿を探せるようにすることもできます。
テンプレートの見た目に満足したら、「公開する」ボタンをクリックし、「保存する」ボタンをクリックします。
先ほど作成したページは新しいアーカイブテンプレートを使用しています。ページを更新または公開し、WordPress サイトにアクセスしてカスタマイザーアーカイブページを見ることができます。
WordPressフルサイトエディターの使い方については、以下のガイドをご覧ください:
方法2:SeedProdを使用してカスタマイザーWordPressアーカイブページを作成する(推奨)
ブロックベースのエディターを使えば、シンプルなカスタムアーカイブページを作成できます。しかし、すべてのテーマで動作するわけではなく、WordPressビルトインブロックとツールに制限されます。
どのWordPressテーマでも動作する完全カスタマイザーのアーカイブページを作成したい場合は、代わりにページビルダーの使用をお勧めします。
SeedProdはWordPressのための最高のドラッグアンドドロップページビルダーです。サイトの投稿をすべて表示するブロックを含む、180以上のテンプレートと既製のブロックが付属しています。
まず、SeedProdをインストールして有効化する必要があります。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。
注: SeedProdには無料版もあり、予算が限られていて始めたばかりの方でもカスタマイザーページを作成することができます。しかし、このガイドでは、より多くのテンプレートとブロックがあるSeedProd Proを使用します。
プラグインを有効化した後、SeedProdはライセンスキーを要求します。
この情報は、SeedProdサイトの自分のアカウントの下にあります。キーを入力した後、「Verify Key」ボタンをクリックしてください。
それができたら、SeedProd ” ランディングページに行き、’新規ランディングページを追加’ボタンをクリックしてください。
カスタムアーカイブページのテンプレートを選択できるようになりました。
SeedProdのテンプレートは、リードスクイーズ、メンテナンスモード、近日公開などのキャンペーンタイプ別に整理されています。画面上部のタブをクリックすると、キャンペーンタイプに基づいてデザインをフィルターすることができます。
デザインをプレビューするには、そのテンプレートにマウスオーバーするだけです。
そして、外観の虫眼鏡アイコンをクリックする。
気に入ったデザインが見つかったら、「このテンプレートを選択」をクリックします。ここでは、まっさらな状態から始められるように「Blank Template」を使用していますが、お好きなテンプレートを使用することができます。
次に、カスタムページの名前を入力します。SeedProdはページのタイトルに基づいて自動的にURLを作成しますが、必要であればこのURLを変更することができます。
入力した情報に問題がなければ、「保存してページの編集を開始する」ボタンをクリックします。
これはSeedProdページビルダーのインターフェースを読み込みます。これはシンプルなドラッグアンドドロップビルダーで、右側にページのライブプレビューが表示されます。
左側にはブロックの設定も表示されます。
まず始めに、コンテンツをカラムにまとめるレイアウトを選ぶ必要がある。
レイアウトの選択」では、使用したいレイアウトをクリックするだけです。どのレイアウトを選択しても構いませんが、私たちはすべてフルスクリーンレイアウトを使用しています。
レイアウトを選んだら、アーカイブページにブロックを追加していきます。
左側のメニューには、デザインにドラッグできるさまざまなブロックがすべて表示されています。今回はカスタムアーカイブページを作成するので、投稿ブロックを追加します。
左側のメニューで、検索バーに「投稿」と入力する。右のブロックが表示されたら、レイアウトにドラッグ&ドロップします。
このブロックはすべての投稿のタイトルを表示します。
また、「Continue Reading」リンクがあり、訪問者がクリックすると各投稿の全文を読むことができる。
初期設定では、このブロックはすべての投稿を表示しますが、特定のカテゴリーやタグを持つ投稿、または特定の投稿者が公開した投稿のみを表示するように変更することができます。
この変更を行うには、レイアウトの「投稿」ブロックをクリックして選択し、左側のメニューの設定を使用するだけです。
例えば、以下の画像では「マーケティング」カテゴリーからの投稿のみを表示しています。
また、投稿のカテゴリーを変更することもできます。例えば、投稿が公開された日やコメント数に基づいて投稿を表示することができます。
投稿の順序を変更するには、’Order By’ボックスまでスクロールし、新しい設定を選択するだけです。初期設定では、SeedProdは「ASC」(昇順)で投稿を表示します。
投稿を降順に並べるには、「Order」ドロップダウンを開き、「DESC」を選択します。
その後、「レイアウト」セクションまでスクロールし、投稿リストの表示方法を変更することができる。
例えば、「カラム」フィールドに新しい数字を入力することで、投稿を複数のカラムに分割することができます。
また、リストに含まれる投稿の数を変更したり、投稿の抜粋を追加または非表示にしたり、「Continue Reading」のテキストを変更したりすることもできます。
投稿リストの見栄えに満足したら、アーカイブページにさらにブロックを追加し、左メニューの設定を使ってそれらのブロックをカスタマイズすることができます。
例えば、「ソーシャル・プロフィール」ブロックを追加することで、ソーシャル・メディアであなたをフォローするよう促したいかもしれない。
ページの設定に満足したら、「保存」の隣にあるドロップダウンの矢印をクリックして、「公開する」を選択します。
カスタムページがWordPressブログのフロントエンドで公開されます。
訪問者がアーカイブページを見つけやすいように、ナビゲーションメニューやサイトのフッターに追加するとよいでしょう。
WordPressの投稿を整理するさらに詳しい方法
カスタムアーカイブページの作成は、WordPressのコンテンツを整理する一つの方法に過ぎません。ここでは、読者がより効果的にあなたの投稿を発見し、ナビゲートするための追加の方法をいくつか紹介します:
- 人気投稿を表示する– 人気投稿プラグインで最も読まれているコンテンツを強調しましょう。WordPressの人気投稿プラグインを比較して、あなたのサイトに最適なソリューションを見つけましょう。
- 表示回数で投稿を表示する–WordPressで表示回数別に人気の投稿を表示する方法をご紹介します。これは、あなたの最も魅力的なコンテンツに注目を集めるのに役立ちます。
- サイドバーでおすすめ投稿を紹介する –WordPressのサイドバーにおすすめ投稿を追加する様々な方法をご紹介します。これは、特定のコンテンツや最近の投稿を宣伝するのに最適な方法です。
- カスタム投稿タイプのアーカイブを作成する– カスタム投稿タイプを使用している場合は、WordPressでカスタム投稿タイプのアーカイブページを作成し、この特殊なコンテンツを整理する方法を学ぶことができます。
- 関連投稿を表示する– 関連コンテンツを表示することで、読者のエンゲージメントを高めましょう。WordPressで関連投稿を表示する方法をステップバイステップでご紹介します。
- 最もコメントされた投稿をハイライトする–WordPressで最もコメントされた投稿を2つの異なる方法で表示する方法のチュートリアルで、最も議論されたコンテンツを紹介しましょう。
- 投稿の順番を入れ替える–WordPressで投稿の順番を簡単に入れ替える方法をご紹介します。これは、キュレーションリストやシリーズを作成する際に特に役立ちます。
- 同じ投稿者の投稿を表示する–WordPressで同じ投稿者の関連投稿を表示する方法についてのチュートリアルで、読者に特定のライターからのより多くのコンテンツを探索するよう促しましょう。
この投稿がWordPressでカスタムアーカイブページを作成するのにお役に立てば幸いです。また、WordPressで 最高の 関連投稿プラグインをピックアップした記事や、最高のカミングスーンページの例に関する投稿日:もお読みください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Martin
Great article.
I have maybe a silly question. Is there any SEO benefit if I have a custom archive page or even archive.php. in the theme folder?
Or is it the same as creating a new page with url mydomain/archive and listing all my posts and pages based on the categories I want. This is what I would prefer.
Thank you
WPBeginner Support
Having a custom archive would not give an SEO benefit, it would be personal preference and you can use your second method if you wanted.
管理者
Aileen
Hi–my site is using the Genesis framework an it has a child theme. I tried to implement the page-archive.php, but I skipped the part where I copy the page design from page.php and I’d hope it would work regardless.
So when I tried implementing this, when I go to my Archive place, it gives an Internal error, ie. 505 and cannot find the page itself.
How does this work with Genesis?
WPBeginner Support
Adding a custom page template would be the same as with any other theme, it seems like there may be a problem with the code you’re using to create the archive page.
管理者
Rahul Lakra
Firstly, Thank you so much. But I can’t see any sidebar in this page. In normal pages it is visible. I will be so happy if you can help me out to display sidebar here too. Thanks In advance!
WPBeginner Support
For the sidebar, sadly that is theme specific for what needs to be added, if you reach out to your theme’s support they should be able to let you know how they have the sidebars added to the templates.
管理者
Vijay Sundaram
Hi,
This was a great tutorial. However, the CSS code for the categories does not seem to work. It is shown as a list with categories and subcategories. Where do I embed the code that you have given in the style.css file? What is meant by make it appear inline? It would be great if you could help me resolve this?
Regards,
Vijay Sundaram
John Paul
Is it possible to filter the archive to just one category of a post?