我正在尝试创建一个页面与木商产品类别在标签。
我的选项卡菜单正在工作,但我需要在每个选项卡内容区域中运行一个查询到相应的类别。
但当我单击每个选项卡时,选项卡内容显示了类别中不属于当前选项卡的所有帖子。我没有得到正在出现的问题,请帮助我解决问题
下面是我的代码:
<?php
echo '<ul class="nav nav-tabs" role="tablist">';
$args = array(
'post_type' => 'product',
'posts_per_page' => 100,
'product_cat' => $category->slug,
'hide_empty'=> 1,
'orderby' => 'name',
'order' => 'ASC'
);
$categories = get_terms( 'product_cat', $args );;
foreach($categories as $category) {
echo '<li><a href="#' . $category->slug.'" role="tab" data-toggle="tab">' .
$category->slug.'('. $category->count .')</a></li>';
$cat_name = $category->slug;
}
echo '</ul>';
echo '<div class="tab-content">';
foreach($categories as $category) {
echo '<div class="tab-pane" id="' . $category->slug.'">';
?>
<?php
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) :
$loop->the_post();
?>
<h1><?php the_title(); ?></h1>
<?php
endwhile;
wp_reset_postdata();
?>
<?php
echo '</div>';
}
?>
问题是它显示每个类别的所有post。我粘在上面了..请帮帮我
首先,你必须得到所有的类别,然后,你必须开始一个类别循环,在这个循环中,按类别得到所有的产品。检查下面的代码。
<?php
function load_scripts() {
wp_enqueue_style( 'jquery-ui-css', get_template_directory_uri().'/assets/css/jquery-ui.css', '' );
wp_enqueue_script( 'jquery-ui-js', get_template_directory_uri().'/assets/js/jquery-ui.js', array('jquery'), time() , false);
}
add_action('wp_enqueue_scripts', 'load_scripts');
function show_product_categories_tabs( $args ){
$atts = shortcode_atts( array(
'' => '',
), $atts, 'show_product_categories_tabs' );
ob_start();
?>
<div id="tabs">
<ul>
<?php
$categories = get_terms( array(
'taxonomy' => 'product_cat',
'hide_empty' => 1,
) );
foreach ( $categories as $key => $cat ) { ?>
<li><a href="#<?php echo $cat->slug; ?>"><?php echo $cat->name; ?></a></li>
<?php } ?>
</ul>
<?php foreach ( $categories as $key => $cat ) {
$args = array(
'post_type' => 'product',
'posts_per_page' => 100,
'product_cat' => $cat->slug,
'hide_empty' => 1,
'orderby' => 'name',
'order' => 'ASC'
);
?>
<div id="<?php echo $cat->slug; ?>">
<?php
$products = new WP_Query( $args );
if( $products->have_posts() ) : while ( $products->have_posts() ) : $products->the_post(); ?>
<h1><?php the_title(); ?></h1>
<?php endwhile; wp_reset_postdata(); endif; ?>
</div>
<?php } ?>
</div>
<script>
( function( $ ) {
$( "#tabs" ).tabs();
$("#tabs ul li").delegate('a', 'click', function(e){
e.preventDefault();
return false;
});
} )(jQuery);
</script>
<?php
$html = ob_get_clean();
return $html;
}
add_shortcode( 'show_product_categories_tabs', 'show_product_categories_tabs', 10, 1 );
?>
经过测试并起作用。