循环浏览类别并为每个Wordpress和Bootstrap 3创建选项卡

时间:2014-07-16 22:39:21

标签: php foreach twitter-bootstrap-3 wordpress

我正在尝试创建一个页面,其中包含我的自定义帖子类型的所有类别作为标签,并带有标签内容。

我可以将所有类别名称显示为选项卡,但我需要在每个选项卡内容区域中运行查询到相应的类别。

因此,当我点击名为“1”的标签时,标签内容区域应仅显示属于名为“1”的标签的类别中的帖子。

到目前为止我的代码:

 <?php
   echo '<ul class="nav nav-tabs" role="tablist">';

$args = array(
'hide_empty'=> 1,
'orderby' => 'name',
'order' => 'ASC'
 );

$categories = get_categories($args);

 foreach($categories as $category) { 

echo '<li><a href="#' . $category->name.'" role="tab" data-toggle="tab">' .      
$category->name.'</a></li>';
$cat_name = $category->name;

} 
echo '</ul>';
echo '<div class="tab-content">';
  foreach($categories as $category) { 
    echo '<div class="tab-pane" id="' . $category->name.'">';


    ?>

<?php 

 $the_query = new WP_Query(array(
  'post_type' => 'acme_product',
  'posts_per_page' => 100,
  'category_name' => $cat_name
    )); 
 while ( $the_query->have_posts() ) : 
 $the_query->the_post();
 ?>

        <h1><?php the_title(); ?></h1>

               <?php 
endwhile; 

 ?>   


  <?php } 
echo '</div>';
 ?>

问题是每个内容区域都显示每个类别的所有帖子。

我想要实现的目标:Link

有什么建议吗?

2 个答案:

答案 0 :(得分:3)

'category_name'参数将value作为类别slug。因此,您应该在查询中使用category slug代替类别名称。

$cat_slug = $category->slug;

$the_query = new WP_Query(array(
             'post_type' => 'acme_product',
             'posts_per_page' => 100,
             'category_name' => $cat_slug
)); 

答案 1 :(得分:0)

我之前曾问过这个问题,但经过一些尝试解决我的问题后,我通过这个完美的鳕鱼解决了它,与我一起工作100%100

<?php
    echo '<ul class="nav nav-tabs" role="tablist">';
    $args = array(
        'hide_empty'=> 1,
        'orderby' => 'name',
        'order' => 'ASC'
    );
    $categories = get_categories($args);
    foreach($categories as $category) { 
        echo 
            '<li>
                <a href="#'.$category->slug.'" role="tab" data-toggle="tab">    
                    '.$category->name.'
                </a>
            </li>';
    }
    echo '</ul>';

    echo '<div class="tab-content">';
    foreach($categories as $category) { 
        echo '<div class="tab-pane" id="' . $category->slug.'">';
        $the_query = new WP_Query(array(
            'post_type' => 'acme_product',
            'posts_per_page' => 100,
            'category_name' => $category->slug
        ));

        while ( $the_query->have_posts() ) : 
        $the_query->the_post();
        echo '<h1>';
            the_title();
        echo '</h1>';
        endwhile; 
    } 
    echo '</div>';
?>