2017-01-11 75 views
1

我想要一個包含我的食物類別(類別ID爲10)的所有歸檔帖子的頁面。我正在嘗試使用col-md-4進行設置,因此我將在一行中放置三個帖子。我想我已將所有必要的元素添加到了我的PHP文件中,但我現在不知道如何設置它。我試圖設置它,所以有3個職位的4列(所以12職位),然後在每12個職位後,它會加載ajax加載更多按鈕。任何人都可以幫我解決這個問題。提前致謝。使用引導程序創建歸檔頁面網格佈局

更新的IT仍然沒有通過帖子循環正確 - 這是隻顯示一個帖子

<?php 
 
get_header(); 
 
get_template_part ('inc/carousel-food'); 
 

 
$the_query = new WP_Query([ 
 
    'posts_per_page' => 12, 
 
    'paged' => get_query_var('paged', 1) 
 
]); 
 

 
if ($the_query->have_posts()) { ?> 
 
    <div id="ajax">          
 
<article class="post">  
 
<div class="row"> 
 
    <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?> 
 
     <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
 
     <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p> 
 
     <?php get_template_part('share-buttons'); ?> 
 
     <a class="moretext" href="<?php the_permalink(); ?>">Read more</a> 
 
     <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?> 
 
    </div> 
 
    
 
    </div> 
 
    
 
</article> 
 
</div> 
 
    <?php if(get_query_var('paged') < $the_query->max_num_pages) { 
 
     load_more_button(); 
 
    } 
 
} 
 
elseif (!get_query_var('paged') || get_query_var('paged') == '1') { 
 
    echo '<p>Sorry, no posts matched your criteria.</p>'; 
 
} 
 
wp_reset_postdata(); 
 
get_footer();

回答

0

你開始在每次循環迭代一個新行。

<div class="row"> 
while ($the_query->have_posts()) { $the_query->the_post(); 

<article class="post">  

    <div class="col-md-4"><?php the_post_thumbnail('medium-thumbnail'); ?> 
     <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
     <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p> 
     <?php get_template_part('share-buttons'); ?> 
     <a class="moretext" href="<?php the_permalink(); ?>">Read more</a> 
     <?php comments_popup_link ('No Comments', '1 Comment', '% Comments', 'comment-count', 'none'); ?> 
    </div> 
</article> 
} 
</div> 

<?php if(get_query_var('paged') < $the_query->max_num_pages) { 
    load_more_button(); 
} 

此外我認爲你可能需要移動你的Ajax選項循環之外:您可以通過將行外循環改變你的代碼?