WordPressでカスタムフィールドを使ってカテゴリーに表示するには

カスタムフィールド追加 カテゴリー表示

ワードプレスでカテゴリーページを作るとき、カスタムフィールドを活用すると、一覧としてカテゴリー(アーカイブ)ページに自動的に表示できるので、とても便利です。
 
そして、利用するユーザーにとってもわかりやすいサイトとなります。
 
カスタムフィールドを利用し、必要な項目を入力するだけにすると、コピペするだけで済み、迷うことがなくなるので効率化に繋がります。

カスタムフィールドの入力方法

例えば、ショッピングサイトを作る場合、画像、商品名、価格が一覧表示されていると、カテゴリーにどんな商品が揃っているのかがわかりやすくなります。

カスタムフィールドを使って、画像、商品名、価格を設定し、category.phpでそれぞれのデータを取得すると、カテゴリーページに自動的に反映させることができます。
 
 
まず、カスタムフィールドの新規追加をクリックして、名前に管理しやすい単語、例えば画像を表示させるなら、「img」を入力します。そして、値には画像のURLを入力します。
 

カスタムフィールド 追加
 

カスタムフィールド 入力
 
次に、入力した名前「img」を使用してcategory.phpで取得します。
 
 

カスタムフィールドの値を取得、表示する

カテゴリーページで、追加したカスタムフィールドの値を表示させるには

<?php echo get_post_meta( $post->ID, 'img', true ); ?>

といった記述をし、htmlタグと組み合わせます。
 
 
htmlタグと組み合わせる一つの方法として、リスト表示を使います。

<ul>
  <li>
    <p><img src="<?php echo get_post_meta( $post->ID, 'img', true ); ?>" /></p>
  </li>
</ul>

 
 
投稿ページを新規追加するたびに、自動的に追加表示させたいので、

<?php while (have_posts()) : the_post(); ?>
<?php endwhile; ?>

 
whileというのは、その間、という意味なので、have_posts:the_post(ページが投稿されていれば、ページがある間繰り返す。)といったところでしょうか。

このループ処理をこのように追加します。↓

<ul>
  <?php while (have_posts()) : the_post(); ?>
    <li>
      <p><img src="<?php echo get_post_meta( $post->ID, 'img', true ); ?>" /></p>
    </li>
  <?php endwhile; ?>
</ul>

 
<li>から</li>まで、投稿ページを追加するたびに追加されていくので、カスタムフィールドの値を自動的にカテゴリーページに表示させることができます。
 

 
あとは、ulとliにそれぞれclass=”○○○”とつけてcssでスタイルを整えるだけでOKです。
 

スラッグ /category/ を消すには

パーマリンク設定でドメイン直下に記事の投稿を表示させる場合、カスタム構造で /%category%/ を作成しなければ、カテゴリーを表示させると
 
https://○○○.net/category/カテゴリー名
 
というようなスラッグができてしまいます。
 
 
真ん中のスラッグ category は、正直必要のないものだと思っています。これを消すには、パーマリンク設定でカスタム構造を選択し
 
/%category%/%○○○% と設定します。(○○○には好きなものを)
 
 
そして、下のカテゴリーベースにドット「.」を入力しておきましょう。
 
スラッグcategoryを消す方法
 
 
そうすると、
https://○○○.net/category/カテゴリー名 
ではなく、
https://○○○.net/カテゴリー名/
というスラッグになり、「category」が表示されなくなります。
 
 
実際にhttps://○○○.net/category/の部分のページを見てみると、中身が存在しないページが表示されます。存在しないページができてしまうと、SEO的にマイナス評価を受けるので、「category」は消す方が良いです。
 
 
ちなみに、、、カテゴリーページを作成するとき、投稿ページの編集画面で、カテゴリーを新規追加することは忘れないでください。
 
 

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です