前回書いた記事
WordPressのカテゴリーページに「カテゴリーの説明」(description)を取得して、更に「カテゴリーの説明」でhtmlを使用する方法
の続きですが、今回は「カテゴリーの説明」ではなく、カテゴリーごとに画像をアップして、アーカイブページに画像を表示する方法をメモ。
1,Advanced Custom Fieldsで画像をアップロードするフィールドを作る
WordPressのプラグイン【Advanced Custom Fields】をインストールし、上記のように画像アップロードするフィールドを作成。
返り値は画像IDにチェックを入れてください。
カスタムフィールドのルールでTaxsonomy Termをセレクトし、右にあるセレクトボックスで画像をアップロードしたいカテゴリー・タクソノミーを選択。
これでカテゴリーの編集で画像をアップできるようになりました。
2,カテゴリーのphpテンプレートで画像取得
カテゴリーのphpテンプレートに下記コードを記載。
カテゴリーの場合
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?php $categories = get_categories(); //$categories = get_categories('parent=0'); 親カテゴリーの場合記載 foreach($categories as $category) : $cat_id = $category->cat_ID; $post_id = 'category_'.$cat_id; $catimg = get_field('catimg',$post_id); $img = wp_get_attachment_image_src($catimg, 'full'); ?> <div><?php echo $category->cat_name; ?></div> <div><a href="category/<?php echo $category->category_nicename; ?>"><img src="<?php echo $img[0]; ?>" alt="<?php echo $category->cat_name; ?>" /></a></div> <?php endforeach; ?> |
タクソノミーの場合
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?php $taxonomy_name = 'ここにtaxonomyname'; $taxonomys = get_terms($taxonomy_name); if(!is_wp_error($taxonomys) && count($taxonomys)): foreach($taxonomys as $taxonomy): $term_id = esc_html($taxonomy->term_id); $term_idsp = "ここにtaxonomyname_".$term_id; $photo = get_field('photo',$term_idsp); $photosp = wp_get_attachment_image_src($photo, 'full'); ?> <a href="/mupamupa/mupacat/<?php echo esc_html($taxonomy->slug); ?>"><img src="<?php echo $photosp[0]; ?>" alt="<?php echo esc_html($taxonomy->name); ?>"> <span class="title"><?php echo esc_html($taxonomy->name); ?></span></a> <?php endforeach; endif; ?> |
taxonomyname_ + termID
と、taxonomynameにアンダーバーを付けてください。これでカテゴリー編集でアップロードした画像が取得できます。