JIN:Rのこと
PR

JIN:Rのカテゴリーページを魅力的にカスタマイズする方法

wordpressテーマ JIN:Rを使った カテゴリーページのカスタマイズ方法
web-kumitatekoubou
記事内に商品プロモーションを含む場合があります
アシスタントさん
アシスタントさん

初期設定のカテゴリーページをおしゃれに作り直したいのですが、特別な知識って必要なのかな。

じゅん
じゅん

固定ページを作ってカスタマイズできるので、記事を書くのと変わらない操作感で作れますよ。

カテゴリーページだけWordPressの標準設定を使っていて、お洒落さが足りないなと感じたことはありませんか。

そこでこの記事では、カテゴリーページをカスタマイズする意義から、JIN:Rで魅力的にカスタマイズするプランと操作方法を紹介します。

この記事を読めば、お洒落さだけではないメリットと、普段の記事を書く感覚で簡単にカスタマイズできることがわかります。豊富なサンプルを見ながら魅力的なカテゴリーページを作り、ウェブサイトの完成度を高めたいと思う方は、ぜひ最後まで読んでください。

もし、WordPressテーマを「JIN:R」にしようかと迷っているなら、あなたの決断を後押しする情報になっていると思います。

Contents
  1. カテゴリーページをカスタマイズする意義
  2. 自分らしく魅力的にするカスタマイズプラン
  3. カテゴリーページのカスタマイズ方法
  4. まとめ：記事と同じ感覚でカテゴリーページも作れる

カテゴリーページをカスタマイズする意義

カテゴリーページはWordPressの標準機能で、WordPressテーマだから作れるページではありません。WordPress管理画面から設定をすれば、カテゴリーページが作られます。記事ページでカテゴリーを選択して公開すれば、該当するカテゴリーページへ自動的に表示されます。

WordPressテーマを選ぶ重要ポイントとして、カテゴリーページが簡単にカスタマイズできることが挙げられます。カスタマイズの自由度が、ウェブサイトやブログの仕上がりに大きな影響を与えます。特に、コンテンツの数が増えてきてから実感する部分です。

カスタマイズ前は、カテゴリー名と新着順に並んでいるだけで味気ない印象になります。

JIN:Rのカテゴリーページのカスタマイズ前の画面

カスタマイズ後は、オリジナルブロックを使ってカテゴリーページを訪れた人に見てもらいたい内容を表示できます。

JIN:Rのカテゴリーページのカスタマイズした後のイメージ

カスタマイズすることで、読者は必要なコンテンツが見つかりやすくなり、サイト運営者は見て欲しいコンテンツ、読者の悩みを解決するのに潜在的に必要なコンテンツを見やすく並べておけます。

読者が必要としているであろう情報へ誘導するためのナビゲーションを整備しておくことは、SEO対策の観点からも大切です。

なぜなら、たくさんのコンテンツにアクセスすることで滞在時間が長くなり、検索意図が満たされることで満足度が高まるからです。読者が知りたかった情報を得て満足し再検索しないと、Googleに有益な情報を提供しているサイトとして評価されます。

自分らしく魅力的にするカスタマイズプラン

ウェブサイトを立ち上げたばかりの頃は、コンテンツ数が少なくてカテゴリーページをカスタマイズしにくいと感じることもあると思います。

JIN:Rのオリジナルブロックを活用した、タイミング別カスタマイズプランを紹介します。

コンテンツが少ないとき

サブタイトル
カテゴリー名
もっと見る
Popular Articles
人気の記事

ブログ構築して間もない初期段階では、カテゴリーごとの記事数が少なく寂しい感じになってしまいがちです。

少しでも賑わいを演出できるオリジナルブロックの組み合わせを考えて、「デザイン見出し」＋「記事リスト」の組み合わせを2回繰り返しています。

デザイン見出しは中央寄せと左寄せを切り替えただけです。

記事リストは、1つ目と2つ目で次のように設定を変えています。

  1. カテゴリ一覧、縦長カード、もっと見るボタンの表示
  2. PV順、横長カード、ランキングラベルの表示

カテゴリ一覧は、指定したカテゴリー内で新着順の表示です。記事数が増えると自動的に充実していきます。

PV順は、厳密にはサイト内で読まれた回数順の表示です。初期段階でよく読まれる記事は読者の需要が高いという意味なので、カテゴリー違いでも表示しておくと読んでもらえる可能性が高くなります。

記事リストで表示する記事数は、1から12の間で設定できます。

コンテンツが増えてから

サブタイトル
カテゴリー名
もっと見る
Popular Articles
人気の記事

記事数が増えてきてコンテンツが充実してきたら、より多くの記事を並べられるように変更します。ただ、記事を多くするとゴチャゴチャしがちなので、記事リストの設定変更をしています。

オリジナルブロックの組み合わせは、「デザイン見出し」＋「記事リスト」の2回繰り返しから変わっていません。

  1. カテゴリ一覧、横長カード、もっと見るボタンの表示。記事数を8に増加。
  2. PV順、テキスト、ランキングラベルと記事のview数の表示

カテゴリー内の記事は表示の大きさを小さくして数を増やして、サイト全体のPV順はテキストに小さくしました。PV数が多い記事のPRは残しながらも、アピール力は控え目にしています。

PR記事が決まっているとき

サブタイトル
カテゴリー名
New Articles
新着記事
もっと見る
Popular Articles
人気の記事

PR記事や、カテゴリーに興味を持ったら読んで欲しい記事を一番最初に表示する方法です。

使っているのは、「デザイン見出し」と「記事リスト」から変えずに、3つの記事リストの設定を使い分けています。

  1. ピックアップ、縦長カード
  2. カテゴリ一覧、横長カード、もっと見るボタンの表示。記事数を6に減少。
  3. PV順、テキスト、ランキングラベルの表示。記事数を3に減少。

ピックアップは、右サイドバーで記事タイトルを検索して指定できます。記事数は3か4にするとバランスが良いです。

コンセプトを伝えたいとき

トップページのようにするか、記事のようにオリジナルブロックを組み立てていきます。

トップページのようにする場合

コンセプトのサブタイトル
コンセプトのタイトル

ここでコンセプトを伝える文章を書いていきます。段落ブロックなので、記事を書くときと同じ要領です。

テキストが入ります。

まずはこちらを読んで！
〇〇を紹介した記事
トップページへ
サブタイトル
タイトルが入ります

ここに記事リストに表示されている記事タイトルの解説を書くこともできます。

1
サブテキスト
メニュー名
2
サブテキスト
メニュー名

メインビジュアルのように大きな画像でイメージを作り、コンセプトエリアを上部に置いて、PR記事にリンクしています。メニューに見立てた記事の一覧で、読んで欲しい記事を表示する方法です。

オリジナルブロックの組み合わせは、「フルワイド」の上に、「スペーサー」と「デザイン見出し」を設置しています。次に、「カラム」を設置して左側に「段落（テキスト）」、右側に「デザイン見出し」と「ボタン」を置きました。そして、「区切り線」で少し間を取ってから、「デザイン見出し」、「段落」と続けてます。最後は、「カラム」を置いて、左右に「デザイン見出し」と「記事リスト」を使いました。

本来ならフルワイドは画面の横いっぱいに広がりますが、記事ページでのサンプルのため短くなっています。背景画像を選択して、スペーサーブロックを置くことで、画像が表示される範囲を調整し、オーバーレイが設定して文字を読みやすく工夫しています。

記事のようにする場合

カテゴリーページで、記事ページを書くようにコンセプトを伝える場合は、「段落（テキスト）」をメインに見出し（h2)を設定するなど普段の執筆と変わらないです。

「記事リスト」や「ブログカード」などを使って内部リンクを多くすると良いと思います。

JIN:RにはこのWordPressテーマを開発したJIN運営の方々デザインした、コードをコピーするだけで使えるデザイン見本帳があります。こちらも超助かる便利メニューなので活用してくださいね。

JIN:R公式の「デザイン見本帳」のマニュアルはこちらから

カテゴリーページのカスタマイズ方法

実は、JIN:Rのようにカテゴリーページをブロックエディターで、直感的にカスタマイズできるWordPressテーマは少ないです。

JIN:R流カスタマイズ方法

JIN:Rは、WordPressのカテゴリーページを直接編集していないです。カテゴリーページ用に設定した固定ページで上書きしています。

固定ページを書くだけなので、記事ページと同じくブロックを並べていく操作でカテゴリーページを作り込みできます。

カテゴリーごとに、違うPR商材にしたり、ブロックの組み合わせを変えたりもできます。また、複数パターンの固定ページを作り適応するページを切り替えることで、反応をテストすることも可能です。

カスタマイズの手順

カテゴリーを設定する

WordPress管理画面のメニューで、投稿の中のカテゴリーを開きます。

「新規カテゴリーを追加」の名前とスラッグを入力します。

JIN:Rのカテゴリーページのカスタマイズで、カテゴリーを設定する方法

スラッグがカテゴリーページのURLの一部になるため、アルファベットで入力します。

スラッグを変更するとURLが変わり新しいページとして扱われてしまいます。検索エンジンからの評価がリセットされるので、一度決めたら変更しないことをおすすめします。

新規固定ページを作成する

WordPress管理画面のメニューで、固定ページを開きます。

「新規固定ページを追加」をクリックします。

JIN:Rのカテゴリーページのカスタマイズで、固定ページを作るメニュー
固定ページをカテゴリーページに設定する

固定ページの右サイドバーから、カテゴリーページに設定します。

JIN:Rのカテゴリーページのカスタマイズで、固定ページをカテゴリーに上書きする設定

カスタムテンプレートに変更します。

カテゴリーページの設定をONにして、タブの中から表示するカテゴリーを選びます。

カテゴリーページで表示したい内容に、固定ページにブロックを設置しページを仕上げます。

ステマ規制への対応設定をする

WordPress管理画面のメニューから、外観の中のカスタマイズを開きます。

WordPress管理画面で、ステマ規制への対応設定のメニュー場所

ステマ規制への対応設定を開き、「記事化されたカテゴリーページ」をONにします。

WordPress管理画面でステマ規制への対応を表示するページを選ぶ

まとめ：記事と同じ感覚でカテゴリーページも作れる

WordPressテーマ JIN:Rで、カテゴリーページをカスタマイズする方法をご紹介しました。

JIN:RはWordPress標準のカテゴリーページに、固定ページを上書きする手法を採用しています。カテゴリーページに適応する操作も固定ページの中で完結できます。

固定ページも記事ページと同じようにオリジナルブロックを組み合わせて作成できて、カスタマイズに特別な操作は不要です。また、記事を書く画面が公開画面とほぼ同じなので、できあがった状態を確認しながら作業できることもメリットです。

カテゴリーページのカスタマイズは、サイトを訪れた人の満足度を高める効果があり、単純にデザイン性の改善以上の効果が期待できます。記事を書くようにカスタマイズできますので、ぜひ取り組んでください。

この記事がJIN:Rをもうすでにお使いの方にも、検討されている方にもお役に立てば幸いです。

初心者にも安心の操作性で
サイト運営をサポート
JIN:R 公式を見る
ABOUT ME
じゅん
じゅん
ブロガー
Contact
2020年9月から細々とブログを書き始め、現在2つのブログ運営中です。
主に、JIN:R購入者限定コミュニティ「JIN BLOG CAMP」 で学びを得ています。
元々、ITやWeb、デザインとは縁遠い、普通の会社員だった私でも、JINやJUN:Rに出会ったことでこんなに整ったブログが作れて感動です。
Recommend
こんな記事も読まれています！
記事URLをコピーしました