How to make bootstrap 4 tab dynamic in wordpress (Error- Showing same data in all tab)
Question
<ul class="nav nav-pills mb-3 " id="pills-tab" role="tablist">
<?php
/**
* Get Categories list with sub category
*/
$terms = get_terms(array(
'taxonomy' => 'portfolio_categories',
'orderby' => 'name',
'hide_empty' => false
));
$i = 0;
foreach ($terms as $term) {
?>
<li class="nav-item">
<a aria-controls="pills-home"
aria-selected="true" <?php echo $i == 0 ? 'class="nav-link active"' : 'class="nav-link"'; ?>
data-toggle="pill"
href="#<?php echo $term->slug; ?>" id="pills-home-tab"
role="tab"><?php echo $term->name; ?></a>
</li>
<?php
if ($i === 0)
$i++;
}
?>
</ul>
<div class="tab-content portfolio-wrapper " id="pills-tabContent">
<?php
$i = 0;
foreach ($terms as $term) {
?>
<div aria-labelledby="pills-home-tab" <?php echo $i == 0 ? 'class="tab-pane fade show active"' : 'class="tab-pane fade show"'; ?>
id="<?php echo $term->slug; ?>"
role="tabpanel">
<main>
<?php
foreach ($terms as $sub_term) {
$args = array(
'post_type' => 'portfolio', // or 'post', 'page'
'orderby' => 'title', // or 'date', 'rand'
'order' => 'ASC', // or 'DESC'
);
}
$products_posts = get_posts($args);
foreach ($products_posts as $products_post) {
?>
<article>
<img alt="Portfolio" class="img-fluid"
src="<?php echo wp_get_attachment_url(get_post_thumbnail_id($products_post->ID)); ?>">
<h2><?php echo $products_post->post_title; ?></h2>
<p><?php echo $products_post->post_content; ?></p>
<a class="btn custom-button"
href="#"><?php the_field('link_label'); ?></a>
<div class="row portfolio-content">
<div class="col-6 text-left">
<i class="far fa-thumbs-up"></i>
<a class="like"> Like
<div class="like-content">
<i class="far fa-thumbs-up"></i>
<input class="qty1" name="qty1" readonly="readonly"
type="text"
value="0"/>
</div>
</a>
</div>
<div class="col-6 text-right">
<div class="share">
<a data-target="#social-sharing" data-toggle="modal"
type="button">
Share
<i class="fas fa-share"></i>
</a>
</div>
</div>
</div>
</article>
<?php
if ($i === 0)
$i++;
}
?>
</main>
</div>
<?php
}
?>
</div>
0
twitter-bootstrap
3 years
2020-03-29T12:51:27-05:00
2020-03-29T12:51:27-05:00 0 Answers
96 views
0
Leave an answer