

初心者です。ワードプレスでホームページを作成していて、  
現在、投稿のアーカイブページでページネーションの設定を  
行ってます。  
他のページのボタンを押しても、１ページ目が表示されます。  
解決方法が分かる方お願いいたします。

PHPわかりませんので、詳しく説明していただけますと幸いです。

下記がコードになります。

PHP

[code]

    <?php the_posts_pagination(
     
        array(  
            'mid_size'      => 2, // 現在ページの左右に表示するページ番号の数
            'prev_next'     => false, // 「前へ」「次へ」のリンクを表示する場合はtrue
            'type'          => 'list', // 戻り値の指定 (plain/list)
            'prev_text'     => __( '前へ'), // 「前へ」リンクのテキスト
            'next_text'     => __( '次へ'), // 「次へ」リンクのテキスト
            'paged' => get_query_var('paged') //これを加えました★) ); 
        )
    ); ?>
    
[/code]

CSS

[code]

    .pagination {
      display: flex;
    }
    
    h2.screen-reader-text {
      display: none;
    }
    
    ul.page-numbers {
      display: flex;
    
      li {
        width: 3.75vw;
        height: 3.75vw;
        border: 1px solid #1b224c;
        text-align: center;
        line-height: 3.90625vw;
        margin-right: 1.484375vw;
        
      }
       li:last-child {
      margin-right: 0vw;
    }
    
      span.page-numbers.current {
        font-size: 1.6rem;
        text-decoration: none;
        font-weight: bold;
        color: #FFF; /* 現在のページの文字色 */
        background: #1b224c; /* 現在のページの背景色 */ 
        padding: 1.3vw 1.4vw 1.3vw 1.4vw;
      }
    
      li:nth-of-type(4) {
        border: none;
      }
    }
    
    span.page-numbers.current {
      font-size: 1.6rem;
      text-decoration: none;
      color: #1b224c;
      font-weight: bold;
    }
    
    a.page-numbers {
      font-size: 1.6rem;
      text-decoration: none;
      color: #1b224c;
      font-weight: bold;
    }
    .pagination {
      display: flex;
      margin: 0 auto;
      width: 25.46875vw;
      padding-bottom: 3.515625vw;
    }
    
    
[/code]

コード自体はネットにあったものに、'paged' => get_query_var('paged') //これを加えました★) );  
これを他のサイトから拾いました（これを入れると治ることもあるようですが治りません。）

また、２ページめに移動したときに、４のカッコが付きません。  
どのようにしたら良いのでしょうか、教えていただけると幸いです。

急いでますので、他のサイトでも質問する予定です。

[![画像の説明をここに入力](https://i.stack.imgur.com/Z9zqw.png)](https://i.stack.imgur.com/Z9zqw.png)

[![画像の説明をここに入力](https://i.stack.imgur.com/fYKBJ.png)](https://i.stack.imgur.com/fYKBJ.png)


CC BY-SA 4.0
2022-03-28T03:33:48.337
88057
2022-04-06T07:45:18.923
2022-03-30T11:19:51.080
49042
49042
question
php wordpress
ページネーションを設定しても２ページ目に行くことが出来ません。


プラグイン（WP-PageNavi）を追加して１からやることにしました。

[code]

      <div class="pagination">
        <div class="list-box">
            <ul>
            <?php
            $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
            $the_query = new WP_Query( array(
                'post_status'    => 'publish',
                'post_type'      => 'post', // ページの種類（例、page、post、カスタム投稿タイプ）
                'paged'          => $paged,
                'posts_per_page' => 10, // 表示件数
                'orderby'        => 'date',
                'order'          => 'DESC'
            ) );
            if ($the_query->have_posts()) :
                while ($the_query->have_posts()) : $the_query->the_post();
                ?>
                    <?php // ブログの一覧を表示する start ?>
                    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
                        <article class="blog-list__list-item">
                            <a href="<?php the_permalink(); ?>" class="blog-item">
                                <?php // アイキャッチを表示させる start ?>    
                                <div class="blog-item__thumbnail-second">
                                    <?php if(has_post_thumbnail()): ?>
                                    <img class="blog-item__thumbnail-image-second" src="<?php the_post_thumbnail_url('large'); ?>">
                                    <?php endif; ?>
                                </div>
                                <?php // アイキャッチを表示させる end ?>
                                <div class="blog-item__content">
                                    <?php // タイトルを表示させる start ?>
                                    <h3 class="blog-item__title"><?php the_title(); ?></h3>
                                    <?php // タイトルを表示させる end ?>
                                    <?php // 抜粋を表示させる start ?>
                                    <h3 class="blog-item__read"><?php the_excerpt(); ?></h3>
                                    <?php // 抜粋を表示させる end ?>
                                    <div class="blog-item__button">
                                        <span class="blog-item__button-more">記事を読む</span>
                                    </div>
                                </div>
                            </a>
                        </article>
                        <?php break; ?>
                        <?php endwhile; ?>
                        <?php while (have_posts()) : the_post(); ?>
    
                        <article class="blog-list__list-item">
                            <a href="<?php the_permalink(); ?>" class="blog-item">
                                <?php // アイキャッチを表示させる start ?>    
                                <div class="blog-item__thumbnail">
                                    <?php if(has_post_thumbnail()): ?>
                                    <img class="blog-item__thumbnail-image" src="<?php the_post_thumbnail_url('large'); ?>">
                                    <?php endif; ?>
                                </div>
                                <?php // アイキャッチを表示させる end ?>
                                <div class="blog-item__content">
                                    <?php // タイトルを表示させる start ?>
                                    <h3 class="blog-item__title"><?php the_title(); ?></h3>
                                    <?php // タイトルを表示させる end ?>
                                    <?php // 抜粋を表示させる start ?>
                                    <h3 class="blog-item__read"><?php the_excerpt(); ?></h3>
                                    <?php // 抜粋を表示させる end ?>
                                    <div class="blog-item__button">
                                        <span class="blog-item__button-more">記事を読む</span>
                                    </div>
                                </div>
                            </a>
                        </article>
                        <?php endwhile; ?>
    <?php endif; ?>
    
                    <?php // ブログの一覧を表示する end ?>
                    <?php break; ?>
                <?php
                endwhile;
            else:
                echo '<div><p>ありません。</p></div>';
            endif;
            ?>
            </ul>
        </div>
    
[/code]

これで出来ました。  
一旦位置から違うネットで拾ったコードを使いやり直し、

[code]

    <?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>
    
    <!-- 最初の投稿のレイアウト -->
    
    <!-- 1件表示してbreakでループを抜ける -->
    <?php break; ?>
    <?php endwhile; ?>
    
    <!-- 2件目からループが始まるはず -->
    <?php while (have_posts()) : the_post(); ?>
    
    <!-- 2件目以降の投稿のレイアウト -->
    
    <?php endwhile; ?>
    <?php endif: ?>
    
[/code]

このようにすることで出来ました。

[code]

    <?php break; ?>
    
[/code]

を最後に追加してループを止めることで完成です。  
ご協力くださった、皆様ありがとうございました。


CC BY-SA 4.0
2022-04-06T07:45:18.923
88198
2022-04-06T07:45:18.923
49042
88057
answer