AFFINGERのカテゴリーページをさらに魅力的ににカスタマイズする方法！

2024年6月8日

WordPressのテーマであるAFFINGERは、カテゴリーページを自由自在にカスタマイズできる優れたテーマです。

一方、一般的なテーマではカテゴリーページに記事が単調に一覧表示されます。

ポイント

本記事では、

AFFINGERで簡単にカテゴリーページを魅力的にカスタマイズする方法をご紹介します。

カテゴリページを工夫することで更に素敵なサイトになりますね。

＼AFFINGER でオシャレサイトを作る方法はこちらをクリックしてください／

1 カテゴリページカスタマイズ例
2 カテゴリページをカスタマイズする方法
3 サンプルページで使ったカスタマイズ方法
4 まとめ

カテゴリページカスタマイズ例

WordPress の優良テーマ「AFFINGER6」で、カテゴリのページをカスタマイズしたサンプルです。

もともとあった「記事の一覧」はページの下のほうに残していますが、ページ上部では、「おすすめ記事」、「主なコンテンツ」、「カテゴリページ内の検索」を載せています。

カテゴリページをカスタマイズする方法

WordPress の管理画面から「投稿」 → 「カテゴリー」を選び、カスタマイズしたいカテゴリーページのカテゴリの編集画面を表示します。

「説明」欄は元来カテゴリの説明を書く欄ですが、（固定ページのように）自由にページを作成することが可能です。

（「画像」を貼ったり、テーブルやリンクを貼るなど、通常の記事のように記載ができます）

AFFINGER では、「カテゴリの説明欄」を編集することで、カテゴリーページを自由にカスタマイズすることが可能です。

カテゴリーの編集ページで設定できる内容の一覧です。

項目	説明
名前	カテゴリーの名前を設定します。カテゴリ一覧でカテゴリー名を表示する名前になります。
スラッグ	カテゴリーを識別するための URL 部分を指定します。例）https://〇〇〇/カテゴリー/スラッグ
親カテゴリ―	親カテゴリ―を指定します。
説明	カテゴリーの説明を設定します。通常の記事のようにすきなレイアウトで表現できます。こちらでカテゴリーページをカスタマイズすることができます。
アイキャッチ画像を登録	アイキャッチ画像を指定します。ここで指定した画像は、カテゴリページの上部に表示します。ただし、Twitter などに URL を貼った場合のサムネイルには反映されません。 ※ Twitter などのサムネイル画像には、「AFFINGER 管理」から指定した画像を利用します。（設定方法は後述 ※1）
カテゴリータイトルの書き換え	カテゴリーページ上のカテゴリータイトルを書き替えます。例）カテゴリー名は「WordPress」だが、カテゴリーページでは「WordPress 関連記事」とタイトルに表示する。
カテゴリーのメタキーワード	メタキーワードを設定します。（SEO 対策用）
カテゴリーのメタディスクリプション	メタディスクリプションを設定します。（SEO 対策用）
背景色	背景色を指定します。
投稿の一覧表示	投稿を一覧表示します。「しない」に設定すると、投稿記事一覧を表示しません。
SNS ボタンの表示	SNS ボタンを表示します。「しない」に設定にすると、SNS ボタンを表示しません。

※1. トップページ、カテゴリページの Twitter 向けサムネイル画像の設定方法です。

＼さっそくトップページにアイキャッチを設定しよう／

: 【AFFINGER】トップページのアイキャッチ画像を設定する方法

Twitter にURLを貼った際にトップページURLではアイキャッチが出ない方もいるかと思います。AFFINGER では、トップページのアイキャッチ画像を指定する場所が特別に用意されています。トップページのアイキャッチ画像の設定方法を紹介します。

続きを見る