Wordpress Bootstrap Accordion: открывайте по одной карте за раз - PullRequest
2 голосов
/ 17 июня 2019

Я испытываю небольшие затруднения с моим аккордеоном начальной загрузки для сайта Wordpress. Все карты аккордеона остаются открытыми (развернутыми) после нажатия на новую карту аккордеона. То, что я надеюсь сделать, это разрешить открывать только одну карту за раз, когда нажатие на новую карту закроет текущую открытую карту.

Вот фрагмент рабочего кода.

PHP

<?php 
        $args = array(
            'post_type' => 'our_work',
            'posts_per_page' => -1,
            'orderby' => 'category',
            'order' => 'ASC',
            'hide_empty' => 0,
        );  
        $loop = new WP_Query( $args );
        $cat = '';//set a variable to catch category
        $first = 0;
        echo '<div id="accordion" class="col-sm-12 offset-xl-4 col-xl-8" role="tablist">';
        while ( $loop->have_posts() ) : $loop->the_post();
            $post_cat = '';
            foreach(( get_the_category() ) as $category) { 
                $post_cat = $category->cat_name . ' '; 
            }

            if($first == 0){
                $first = 1;
                $cat = $post_cat;

                echo '<div class="card work-card box-shadow">';
                echo'<div class="card-header" role="tablist" id="'.get_the_id().'">';
                echo'<h5 class="mb-0">';
                echo'<a class="accordion-toggle collapsed toggle" data-toggle="collapse" href="#collapse'.get_the_id().'" aria-expanded="false" aria-controls="collapseOne">'.$post_cat.'</a>';
                echo'</h5>';
                echo'</div>';

                //start collapse pannel
                echo'<div id="collapse'.get_the_id().'" style="transition: all 0.5s ease 0s;" class="collapse nomnom work-card-collapse" aria-labelledby="heading'.get_the_id().'">';
            }

            if($cat != $post_cat){
                $cat = $post_cat;
                echo'</div>';//close collapse
                echo'</div>';//close box shadow
                echo '<div class="card work-card box-shadow">';
                echo'<div class="card-header" role="tablist" id="'.get_the_id().'">';
                echo'<h5 class="mb-0">';
                echo'<a class="accordion-toggle toggle" data-toggle="collapse" href="#collapse'.get_the_id().'"aria-expanded="false" aria-controls="collapseOne">'.$post_cat.'</a>';
                echo'</h5>';
                echo'</div>';
                //start collapse pannel
                echo'<div id="collapse'.get_the_id().'" style="transition: all 0.5s ease 0s;" class="collapse nomnom"  aria-labelledby="heading'.get_the_id().'">';
            }
            echo'<div class="card-block in">';
            echo'<h3 class="underline">'.get_the_title().'</h3>';
            echo'<p>'.get_the_content().'</p>';
            echo'</div>';

            if (($loop->current_post +1) == ($loop->post_count)) { 
                echo '</div>';//close collapse 
                echo '</div>';//box shadow close
            } 
        endwhile; 
        wp_reset_query();
        echo '</div>';//close accordian close
    ?>

Я видел сообщения, связанные с этой темой, и предлагаю удалить "data-parent" , но мой код не включает его ...

Что можно сделать?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...