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
Mayur Galaiya 7 months 0 Answers 81 views 0

Leave an answer