投稿のループ
<?php
$args = array(
'post_type'=>'post',
'posts_per_page'=>-1,
'paged'=>$paged,
);
$the_query = new WP_Query($args);
if ($the_query->have_posts()) :
while ($the_query->have_posts()) : $the_query->the_post();
//内容
endwhile;
wp_reset_postdata();
endif;
?>$args
取得したい投稿の条件を配列で定義する部分。$the_query = new WP_Query($args)
定義した条件でデータベースに問い合わせを行い、結果を変数 $the_query に格納する。if ($the_query->have_posts())
記事が1件でもあれば実行。while ($the_query->have_posts()) : $the_query->the_post()the_post() でその記事のデータをセットし、テンプレートタグ(the_title() など)を使える状態にする。have_posts() で次の記事があるか確認。wp_reset_postdata()the_post() によって書き換えられたグローバルな $post 変数を、クエリ実行前の元の状態に戻す重要な関数。
タグのスラッグをクラスに追加する
<?php
$tags = get_the_tags();
$tag_class = ($tags && !empty($tags)) ? 'tag-' . $tags[0]->slug : 'no-tag';
?>HTML要素の class 属性に$tag_classを出力することで、タグごとにデザイン(背景色やアイコンなど)を切り替える。
get_the_tags()
現在の投稿(ループ内)に設定されているタグを、オブジェクトの配列として取得します。タグが一つもない場合は false を返す。$tags && !empty($tags)
タグが正常に取得できているか(空ではないか)をチェックする。
現在の投稿に紐づくタグを取得
<?php
$post_tags = get_the_tags();
if (!empty($post_tags)) : ?>
<ul class="tag--01">
<?php foreach ($post_tags as $tag) :
$tag_link = get_tag_link($tag->term_id);
?>
<li class="tag-item">
<a href="<?php echo esc_url($tag_link); ?>">
<span class="tag-icon"></span>
<span class="tag-name"><?php echo esc_html($tag->name); ?></span>
</a>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>WordPressの投稿に紐づいているタグを一覧(リスト形式)で表示するための標準的なコード。
$post_tags = get_the_tags()
タグ情報を配列として取得し、変数 $post_tags に格納する。if (!empty($post_tags)) :
タグが1つ以上存在するかのチェック。$tag_link = get_tag_link($tag->term_id)
タグのIDを使って、そのタグの一覧ページへのURLを取得する。
前後の記事オブジェクトを取得
<?php
// 前後の記事オブジェクトを取得
$prev_post = get_previous_post();
do_action( 'qm/debug', $prev_post);
$next_post = get_next_post();
?>
<nav class="postNavi--01">
<?php if (!empty($prev_post)) : ?>
<div class="postNavi-item">
<a href="<?php echo get_permalink($prev_post->ID); ?>" class="nav-link-item nav-prev">
<span class="postNavi-title"><?php echo esc_html($prev_post->post_title); ?></span>
</a>
</div>
<?php else : ?>
<!-- 前の記事がない場合のプレースホルダー(または空) -->
<div></div>
<?php endif; ?>
<?php if (
!empty($next_post)) : ?>
<div class="postNavi-item">
<a href="<?php echo get_permalink($next_post->ID); ?>" class="nav-link-item nav-next">
<span class="postNavi-title"><?php echo esc_html($next_post->post_title); ?></span>
</a>
</div>
<?php else : ?>
<!-- 次の記事がない場合のプレースホルダー(または空) -->
<div></div>
<?php endif; ?>
</nav>シングルページの投稿の下によくある前の記事と次の記事を表示させる
get_previous_post()
現在表示している記事よりも、投稿日時が古い記事を取得する。
get_next_post()
現在表示している記事よりも、投稿日時が新しい記事を取得する。if (!empty($prev_post)) :
記事が存在する場合のみリンクを表示する。もし現在表示している記事が「一番古い記事」だった場合、前の記事は存在しないため、else 以降の空の <div></div> が出力される。