どうも、「きにぶろぐ.com」の自由に憧れるフリーマン(@free_manJJ)です。
サイドバーにカテゴリーを設置しているブログをよく見かけるようになり、今や設置されていないブログやサイトの方が少ないのではないでしょうか。
カテゴリーは投稿記事を最適なワードに分類できるだけでなく、ユーザビリティも向上する為、検索エンジンからの評価も高まりSEO対策にもなる便利機能です。
カテゴリー名は自分で設定したり追加することができるので、重要なキーワードを上手く盛り込むことでその機能を効果的に発揮させることが可能です。
記事の作成時はカテゴリーの設定が必要不可欠になるので、忘れずに指定するようにして下さい。
またサイドバーにカテゴリーを表示させていない場合は、意図的な理由がなければなるべく表示させるようにしましょう。
それではワードプレス(WordPress)でカテゴリーの追加や、ウィジェットを使って投稿数や階層を表示させる方法についてご紹介します。
ワードプレスのカテゴリー追加方法
ワードプレスの管理画面メニューから「投稿」⇒『カテゴリー』をクリックします。
新規カテゴリーの追加ページが表示されるので、以下の項目を入力して『新規カテゴリーを追加』をクリックします。
「カテゴリー名」は投稿記事に関連するワードかつ、検索されやすいものを設定します。
「スラッグ」はカテゴリー名をURL化したものを入力するので、例えば「ブログ」がカテゴリー名ならスラッグには、「blog」のように半角小文字の英数字・ハイフンを使用します。
パーマリンクの設定次第ではカテゴリーURLも記事URLに含まれるので、スラッグの設定は重要になります。
カテゴリーは階層表示させることもできる為、追加するカテゴリーの大本となるワードをすでに使用している際は、「親カテゴリー」を設定しておきます。
「説明」の欄は特に重要ではないので、空白のままでも問題はありません。
これでカテゴリーの追加については以上になります。
カテゴリーウィジェットの使い方
ワードプレスでは、ウィジェットを使ってカテゴリーをサイドバーに表示させることができます。
管理画面メニューから「外観」⇒『ウィジェット』をクリックして下さい。
「利用できるウィジェット」からカテゴリーをドラッグ&ドロップで「サイドバートップ」か「サイドバーウィジェット」に追加します。
次にカテゴリーの表示方法を以下の中から設定することができます。
「タイトル」には任意のものを入力して表示させることができますが、サイドバートップの場合はこのタイトル部分が表示されませんので覚えておいて下さい。
また、「ドロップダウン」「投稿数」「階層」について順にご説明していきます。
ドロップダウン表示
「ドロップダウン」表示とは、「▼」マークをクリックすることで各カテゴリーがリスト形式で表示されるものになります。
ドロップダウンはコンテンツの増加に伴ってカテゴリー項目が多くなってきた時に、通常表示ではスペースを取りすぎてしまうといった場合に有効な表示方法です。
カテゴリー数が少ない間はあまり使用する機会はないかと思います。
投稿数を表示
「投稿数」の表示では、カテゴリーの右側に現在対象のカテゴリー内にある投稿記事数が表示されるようになります。
記事数が少ないうちは訪問ユーザーにコンテンツ数が少ないことが、あからさまに伝わってしまうので表示させるメリットはあまり感じられません。
ただ、各カテゴリーごとの記事数を管理したい場合には有効活用できるので、状況に応じて使い分けてもいいかもしれません。
階層を表示
「階層」を表示は親カテゴリーと子カテゴリーがある場合に、「親」を基準に階層的に「子」が表示されるようになります。
子カテゴリーを複数設定している際は、階層表示にすることで関連するカテゴリーに誘導しやすくなるので、親と子の設定状況によって活用するかを判断していきましょう。
また、表示方法を複数組み合わせて使うことも可能なので、自分のブログやサイトに合った設定でサイドバーに表示させていくようにして下さいね。
CSSでカスタマイズされる方へ
CSSコードを使ってカテゴリーのデザインをもっとかっこよく、キレイに使いやすくカスタマイズすることもできます。
ただし、1つ問題点として「display: block」コードを使って横幅いっぱいに設定を変更した際に、投稿数も表示している方はリンクタグから弾き出されて表示が崩れてしまう場合があります。
なのでその対策方法をここでご紹介しておきたいと思います。
投稿数をリンクタグ内に収める方法
投稿数ありの状態で「display: block」のCSSコードにより、カテゴリーをブロック形式で表示させた場合は以下のように表示されます。
ブロックエリアがカテゴリーの横幅いっぱいに設定変更されたことによって、投稿数がリンクの外側に弾き出された形で表示されているのがわかります。
そもそもこのブロックエリアが何なのかを説明しますと、通常はテキストリンクにカーソルを合わせないとクリックできませんが、ブロックエリアを設定することによってエリア内であれば、どこでもクリックが可能になります。
クリック有効範囲が広がるとユーザビリティも向上するので、このようなカスタマイズをされる方も多いと思います。
このままの表示ではカッコが悪いので、「functions.php」を使って修正を行います。
functions.phpにコードを追加
「functions.php」ファイルにコードを追加する場合は、事前に必ずバックアップファイルを用意しておくようにして下さい。
追加したコードが少しでも間違っていたりすると、ワードプレス自体アクセスできなくなってしまいます。
参考:「functions.php」の編集後に画面が真っ白!原因とエラーを直す方法 |
ワードプレス管理画面の「外観」⇒『テーマの編集』をクリックします。
子テーマ内の「functions.php」ファイルの一番下に以下のコードを追記します。
// カテゴリの投稿数をaタグの中に add_filter( 'wp_list_categories', 'my_list_categories', 10, 2 ); function my_list_categories( $output, $args ) { $output = preg_replace('/<\/a>\s*\((\d+)\)/',' ($1)</a>',$output); return $output; }
コードを追加後、下にある『ファイルを更新』をクリックすると、以下のようにカテゴリーの表示が変更されます。
投稿数がリンクタグ内に含まれるようになり、キレイに表示することができました。
これで投稿数をリンクタグ内に収める方法は以上になります。
これからカテゴリーをCSSカスタマイズされる方は、ここでご紹介した内容を知っておくと役に立つかと思います。
まとめ
ワードプレスのカテゴリー設定やウィジェットを活用したサイドバーの利用は、SEO対策にしてもユーザビリティにしても非常に効果のあるものです。
コンテンツを増やしながらカテゴリーを適切に追加して表示しておくだけでも、検索エンジンに評価してもらえるのでアクセス増加にも繋がります。
記事作成を行うのと同時にカテゴリーの設定、必要であれば追加して最適化を行っていくようにしましょう。