デイトラweb制作上級編 DAY25~26②
nakano
演習課題：「制作ジャンル」タクソノミーのテンプレートも完成させよう
archive-work.phpを参考にして編集し、taxonomy-genre.phpを開いている制作ジャンルに対してラベルがハイライトされるように実装する
taxonomy-genre.php
<div class="genre-nav">
<div class="genre-nav-link">
<!-- 「すべて」に付与している「is-active」を削除 -->
<a href="<?php echo esc_url(get_post_type_archive_link('work')); ?>">すべて</a>
</div><!-- /.genre-nav-link -->
<!-- 現在の制作ジャンルを取得 -->
<?php
$genre_highlight = get_queried_object();
$genre_name = $genre_highlight->name;
?>
<?php
$genre_terms = get_terms('genre', array('hide_empty' => false));
foreach ($genre_terms as $genre_term) :
?>
<div class="genre-nav-link">
<!-- 条件付きでクラスを設定 -->
<a class="<?php if ($genre_name == esc_html($genre_term->name)) {
echo "is-active";
} ?>" href="<?php echo esc_url(get_term_link($genre_term, 'genre')); ?>">
<?php echo esc_html($genre_term->name); ?></a>
</div><!-- /.genre-nav-link -->
<?php
endforeach;
?>
</div><!-- /.genre-nav -->参考サイト
・関数リファレンス/get queried object
・get_queried_object()を使って開いてるジャンルにハイライトがいくようにしたい
演習課題2：single-work.phpに関連記事を表示させよう
single-work.php
<?php
$terms = get_the_terms($post->ID, 'genre');
foreach ($terms as $term) {
$term_slug = $term->slug; // 現在表示している投稿に属しているタームを取得
}
$related_query = new WP_Query(
array(
'post_type' => 'work', // 投稿タイプ
'posts_per_page' => '3', // 3件を取得
'post__not_in' => array($post->ID), // 表示中の投稿を除外
'orderby' => 'rand', // ランダムに
'tax_query' => array( // タクソノミーの指定
array(
'taxonomy' => 'genre',
'field' => 'slug',
'terms' => $term_slug, // 取得したタームを指定
)
)
)
);
?>関連記事のループの仕方は 上級編 DAY13~14 の時を参考にする
「投稿」ではなく「カスタム投稿」であるため、
投稿タイプが'post'ではなかったり、カテゴリーの部分がタクソノミーになっていたりと変化しているところもちょっとだけある
まとめ
今回はDAY25~26の①でできなかった演習課題に手を付けました。
色々なサイトを参考にコードを書いてもなかなかうまく表示されず、どちらとも完成させるのに苦労しました。。。
Web制作会社と仕事をするときに本当に大事なところみたいなので、もう一度見直してしっかり押さえておきます！
