ワードプレスのボタンをクリックするとカテゴリに残りの投稿を表示

Question

私は現在、私のカスタム投稿の各カテゴリの最初の8つの投稿を表示しています。posts_per_page。私が今必要なもの

<?php 
    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; 
    $query_args = array(
    'post_type' => 'gallery', 
    'category_name' => 'abstract', 
    'posts_per_page' => 8, 
    'paged' => $paged); 
    $the_query = new WP_Query($query_args); 
?> 

<?php if ($the_query->have_posts()) : while ($the_query->have_posts()) : $the_query->the_post(); ?> 

    <!-- loop contents --> 
    <?php the_title(); // etc etc ?> 

<?php endwhile; ?> 
<?php endif; ?> 

は、そのカテゴリ内の8件の以上の記事がある場合にのみ、「残りの部分を参照してください」と言っループの下に示したボタンです。

クリックすると、そのカテゴリの残りの投稿が同じページに「公開」されます。それだけです！

これはAJAXなしで行うことができますか？私はそれがかなりまっすぐ進むべきであるように感じるが、私は解決策を見つけるのが難しい。

Answer 1

これは、CSS ：nth-​​childと組み合わせて、js/jQueryを使用して終了しました。まず、カテゴリ内のすべての投稿をループ内で制限するのではなく、ロードしました。 「ギャラリー・コンテナ」のクラスで8つの以上のdivがあるかどうかを確認し、もしそうであれば、ページの読み込みにそれらを隠すために、本質的に「チェック」するn番目の子：その後、とき

.gallery-container:nth-child(n+9) 
    display: none 

それから私は、を使用しましたjQueryを使用して 'show'クラスを追加することによって、ボタンを非表示にします。

.show 
    display: block !important 

のjQuery：

$('.btn-show-more').on('click', function(){ 
    $('.gallery-container:nth-child(n+9)').toggleClass('show'); 
}); 

が、これはそこに誰もが同じ問題に苦しんでお役に立てば幸いです。私はこれがこれを解決する最善の方法であるかどうかはわかりませんが、私のためにはうまく働いています。