Всем доброго времени суток!
Впервые натягиваю верстку на cms. Решил начать с WP. Все практически готово, кроме одного блока - его уже четвертый день не могу оформить. Это блок показа товаров через переключение табов.
Вот fiddle чистого html для понимания функционала блока
jsfiddle.net .
Я это представляю так: В админке создаются подкатегории в одной из четырех категорий.
Родительская категория - это группа товаров (например, масло), а
дочерние категории - это бренды. При клике на бренд показываются все
записи из подкатегории этого бренда.
Я пытался сделать вот так:
Спойлер Код php<div class="container-fluid third-screen" id="produkcija">
<section class="container catalog-block">
<h2 class="section-heading"><?php
$idObj = get_category_by_slug('goods_section');
$id = $idObj->term_id;
echo get_cat_name($id);
?></h2>
<div class="scor-tab-block">
<div class="row main-row">
<ul class="nav nav-tabs scor-nav-tabs" role="tablist">
<li role="presentation" class="col-xs-6 col-md-3 scor-tab-list active">
<a href=".oil" class="noscroll" aria-controls="oil" role="tab" data-toggle="tab" id="oils">
<?php
$idObj = get_category_by_slug('sub_oils');
$id = $idObj->term_id;
echo get_cat_name($id);
?>
</a>
</li>
<li role="presentation" class="col-xs-6 col-md-3 scor-tab-list">
<a href="#car-recharges" class="noscroll" aria-controls="car-recharges" role="tab" data-toggle="tab" id="accumulators">
<?php
$idObj = get_category_by_slug('sub_akb');
$id = $idObj->term_id;
echo get_cat_name($id);
?>
</a>
</li>
<li role="presentation" class="col-xs-6 col-md-3 scor-tab-list">
<a href="#autodetails" class="noscroll" aria-controls="autodetails" role="tab" data-toggle="tab" id="autoparts">
<?php
$idObj = get_category_by_slug('sub_parts');
$id = $idObj->term_id;
echo get_cat_name($id);
?>
</a>
</li>
<li role="presentation" class="col-xs-6 col-md-3 scor-tab-list">
<a href="#wheels" class="noscroll" aria-controls="wheels" role="tab" data-toggle="tab" id="tires">
<?php
$idObj = get_category_by_slug('sub_tires');
$id = $idObj->term_id;
echo get_cat_name($id);
?>
</a>
</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active oil">
<div class="card-wrapper-tab visible-lg visible-md"> <ul id="tab-oil" class="nav nav-tabs nav-stacked scor-nav-tabs-inner">
</ul>
<?php
$i=1;
$cat = get_query_var('cat');
$categories = get_categories('parent='.$cat.'');
foreach ($categories as $category) { $i++; }
if ($i > 1) {
echo "<ul>";
foreach ($categories as $category) { ?>
<li><a href="<?php echo get_category_link($category->term_id); ?>" ><?php echo $category->name; ?></a></li>
<?php }
echo "</ul>";
} else {
$pcat = get_category(get_query_var('cat'),false);
$pcatid = $pcat->category_parent;
$categories = get_categories('parent='.$pcatid.'');
echo "<ul>";
foreach ($categories as $category) { ?>
<li<?php if ($category->term_id == $cat) { ?> class="active"<?php } ?>><a href="<?php echo get_category_link($category->term_id); ?>" ><?php echo $category->name; ?></a></li>
<?php }
echo "</ul>";
}
?>
<?php if ( have_posts() ) : query_posts('cat=15');
while (have_posts()) : the_post(); ?>
<div id="content-oil" class="tab-content scor-tab-inner-content">
<div class="tab-pane scor-tab-inner-pane fade in" id="oil-repsol">
<div class="product-card col-md-12">
<blockquote><?php the_excerpt(); ?></blockquote>
<div class="row">
<div class="product-img col-md-2 col-sm-4"><?php the_post_thumbnail(array(100, 100)); ?>
</div>
<div class="product-description col-md-10 col-sm-8">
<h3> <?php the_title(); ?></h3>
<?php the_content(); ?>
</div>
</div>
<hr>
</div>
</div>
</div>
<? endwhile; endif; wp_reset_query(); ?>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
Очень прошу помощи! Что я делаю не так?
Заранее всех благодарю за участие!