【WordPress】ページャーで1ページ目と2ページ目以降で表示件数を変えたときのメモ

電脳備忘録

ページャーを実装しつつ、1ページ目のみ最新記事1記事とそれ以外の6記事の計7件、2ページ以降は1ページあたり6記事を表示するように対応したときのメモ。

先日アップしたコードは1ページ目に表示された最後の記事が、2ページ目の最初に表示されるという不具合があることが判明したので修正しました。

意図した通り動いた

こちらのサイトを参照して解決しました

[WordPress] offsetを使用したページネーション処理

home.phpの記述(コード例)

<?php
// 「1ページに表示する最大投稿数」の取得
$per_page = get_option('posts_per_page');
// 現在表示しているページ数の取得
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
// 1ページ目か2ページ目以降かを判定
if (is_paged()) {
// 2ページ目以降の処理
$offset = ($paged * $per_page) - ($per_page - 1);
} else {
// 1ページ目の処理
$offset = 1;
}
if (!is_paged()) {
// 最新1件の情報を取得
$first_args = array(
'numberposts' => 1
);
$first_posts = get_posts($first_args);
if ($first_posts) {
foreach ($first_posts as $post) {
// ここに1件目の情報を書く
}
wp_reset_postdata();
}
}
// 2件目以降
$args = array(
'posts_per_page' => $per_page,
'offset'         => $offset
);
$the_query = new WP_Query($args);
if ($the_query->have_posts()) {
while ($the_query->have_posts()) {
$the_query->the_post();
// ここに2件目以降の情報を書く
$permalink = get_permalink();
}
}
// ページネーション
$paginate_base = get_pagenum_link(1);
$paginate_format = '';
if (strpos($paginate_base, '?') || !get_option('permalink_structure')) {
$paginate_format = '';
$paginate_base = add_query_arg('paged', '%#%');
} else {
$paginate_format = (substr($paginate_base, -1 ,1) == '/' ? '' : '/') . user_trailingslashit('page/%#%/', 'paged');
$paginate_base .= '%_%';
}
echo paginate_links(array(
'base'      => $paginate_base,
'format'    => $paginate_format,
'prev_text' => __('<'),
'next_text' => __('>'),
'total'     => $the_query->max_num_pages,
'mid_size'  => 5,
'current'   => ($paged ? $paged : 1),
));
wp_reset_postdata();
?>

function.phpの記述

//ページャー
function special_offset_pregp_wpse($qry) {
if ($qry->is_main_query() && !is_admin()) {
$ppg = get_option('posts_per_page');
$offset = 1;
$offset = $offset + (($qry->query_vars['paged'] - 1) * $ppg);
$qry->set('posts_per_page', $ppg);
$qry->set('offset', $offset);
add_filter('found_posts', 'special_offset_pregp_fp_wpse', 1, 2);
}
}
add_action('pre_get_posts', 'special_offset_pregp_wpse');
function special_offset_pregp_fp_wpse($found_posts) {
return $found_posts - 1;
}

今後このような依頼があった場合はこれで対応するとしますかね・・・。

これはダメだった

最初のli要素でかつ、1ページ目だったらlatestクラスを付与するようにし、CSSで最新記事とそれ以外の表示を設定。

<ul>
<?php
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
if ($paged == 1) {
// 1ページ目の場合
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'order' => 'DESC',
'orderby' => 'date',
'posts_per_page' => 7, // 最新記事1件 + その他の記事6件
'paged'          => $paged,
);
} else {
// それ以外の場合(2ページ目以降)
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'order' => 'DESC',
'orderby' => 'date',
'posts_per_page' => 6, // 最新記事以外の記事6件
'offset'         => 6 + (($paged - 2) * 6), // 2ページ目以降の最新記事以外の記事のオフセット
'paged'          => $paged,
);
}
$query = new WP_Query($args);
if ($query->have_posts()) : ?>
<?php while ($query->have_posts()) : $query->the_post(); $counter++;?>
<?php if ($counter <= 1): //1番目の要素の処理?>
<?php if (!is_paged()) : //1ページ目の処理を書く?>
<li class="latest">
<?php else:  //2ページ目以降の処理を書く?>
<li>
<?php endif; ?>
<?php endif; ?>
<!-- ここに処理を書く -->
</li>
<?php endwhile; ?>
</ul>
<!-- ページネーション -->
<div class="pager-nav-wrapper">
<div class="pager-nav">
<?php
$paginate_base = get_pagenum_link(1);
$paginate_format = '';
if (strpos($paginate_base, '?') || !get_option('permalink_structure')) {
$paginate_format = '';
$paginate_base = add_query_arg('paged', '%#%');
} else {
$paginate_format = (substr($paginate_base, -1 ,1) == '/' ? '' : '/') . user_trailingslashit('page/%#%/', 'paged');
$paginate_base .= '%_%';
}
echo paginate_links(array(
'base'      => $paginate_base,
'format'    => $paginate_format,
'prev_text' => __('<'),
'next_text' => __('>'),
'total'     => $query->max_num_pages,
'mid_size'  => 5,
'current'   => ($paged ? $paged : 1),
));
?>
</div>
</div><!--/.pager-nav-wrapper-->
<?php wp_reset_postdata(); ?>
<?php else : ?>
<!-- ここに記事がない場合の内容 -->
<?php endif; ?>

1記事目とそれ以外で表示を変えるというのはちょいちょい実装したことがありますが、あわせてページャーを実装というのは対応したことが無かったような気がします。忘れているだけかもしれませんが・・・

広告

ブログの維持費に充てるでございます・・・。