page
<?php /** * Template Name: blog */ get_header(); ?> <main> <!-- サブビジュアル --> <section class="sub__mv __blog__mv"> <div class="sub__mv__ttl"> ブログ </div> </section> <!-- パンくずリスト --> <section class="breadcrumb"> <div class="container"> <div class="breadcrumb__inner"> <?php get_template_part('template-parts/breadcrumb'); ?> </div> </div> </section> <!-- ブログ一覧 --> <section class="bloglists"> <div class="container"> <div class="headline __small"> 新着一覧 </div> <div class="bloglists__inner"> <?php $paged = get_query_var('paged') ?: 1; //ページネーションを使いたいなら指定 $wp_query = new WP_Query(); $my_posts = array( 'post_type' => 'post', 'posts_per_page' => '10', 'paged' => $paged, //ページネーションを使いたいなら指定 ); $wp_query->query($my_posts); if ($wp_query->have_posts()) : while ($wp_query->have_posts()) : $wp_query->the_post(); ?> <!-- ここにコンテンツ --> <div class="blog__items lower"> <div class="item__img lower"> <?php if (has_post_thumbnail()) : ?> <?php the_post_thumbnail('medium'); ?> <?php else : ?> <img src="<?php echo get_template_directory_uri(); ?>/img/240x240.png" > <?php endif; ?> <p><?php $cat = get_the_category(); $cat = $cat[0]; { echo $cat->cat_name; } ?></p> </div> <div class="blog__item"> <div class="blog__date lower"><?php the_time('Y-m-d'); ?></div> <div class="blog__item__ttl lower"> <a href="<?php the_permalink(); ?>"> <?php if(mb_strlen($post->post_title, 'UTF-8')>40){ $title= mb_substr($post->post_title, 0, 40, 'UTF-8'); echo $title.'…'; }else{ echo $post->post_title; } ?></a> </div> <div class="blog__item__desc"> <?php //brとspanを残す if(mb_strlen($post->post_content, 'UTF-8')>60){ $content= mb_substr(strip_tags($post->post_content, '<br><span>'), 0, 60, 'UTF-8'); echo $content.'…'; }else{ echo strip_tags($post->post_content, '<br><span>'); } ?> </div> </div> </div> <?php endwhile; endif; wp_reset_postdata(); ?> </div> <div class="pagenation"> <?php if (function_exists('wp_pagenavi')) { wp_pagenavi(); } ?> </div> </div> </section> <section class="cta"> <div class="container"> <div class="cta__Induction">まずは無料で資料請求から</div> <div class="btn__center"><a class="btn __large" href="<?php the_permalink(2126); ?>">資料請求</a></div> <div class="contact__center"><a href="<?php the_permalink(2126); ?>">お問い合わせ</a></div> </div> </section> <section class="tel"> <div class="container"> <div class="tel__inner"> <div class="tel__text">お電話でのお問い合わせはこちら</div> <div class="tel__number">0123-456-7890</div> <div class="tel__time">平日08:00~20:00</div> </div> </div> </section> </main> <?php get_footer(); ?> ``` WordPress初心者です。 カンプコーディングしたhtmlを WordPress化しております。 固定ページにブログの記事一覧を表示させており、そこに「WP-PageNavi」のプラグインでページネーションの実装をしたいです。 ページネーションはきちんと表示されて、2ページ目以降も表示されるのですが、何故か2ページ目だけがレイアウトが崩れます。 3ページ目以降はきちんと表示されています。 レイアウトが崩れている原因を検証で見ようとしました。 ページネーションは<div class="bloglists__inner">の外に書いているのですが、何故か2ページ目だけ、<div class="blog__items lower">の中に入っており、display:flexが適用されてしまっています。 ダミー投稿(テーマユニットテストデーター)の先頭固定ページが原因かなと思いましたが、無効にしても変わりませんでした。 何か解決策はありますでしょうか。 宜しくお願いいたします。
post_titleやpost_contentを加工していますが、それによりhtmlが崩れていないでしょうか?
まだ回答がついていません
会員登録して回答してみよう