Wordpress child taxonomy on click to link to the child archive and side bar category to expand/active

Below is my html

<div class="tp-toggle-holder">
    <div class="tp-toggle-row">
        <!--<h3 class="active">Fresh, Frozen &amp; Chilled</h3>-->
        <h3 class="1">Fresh, Frozen &amp; Chilled</h3>
        <div class="tp-toggle-details active-toggle">
            <ul>
                <li><a href="/coupons/fresh-frozen-chilled/fruits/">Fruits</a></li>
                <li><a href="/coupons/fresh-frozen-chilled/vegetables/">Vegetables</a></li>
                <li><a href="/coupons/fresh-frozen-chilled/chicken/">Chicken</a></li>
            </ul>
        </div>
    </div>
    <div class="tp-toggle-row">
        <!--<h3 class="">Dairy, Chilled &amp; Eggs</h3>-->
        <h3 class="">Dairy, Chilled &amp; Eggs</h3>
        <div class="tp-toggle-details ">
            <ul>
                <li><a href="/coupons/dairy-chilled-eggs/eggs/">Eggs</a></li>
                <li><a href="/coupons/dairy-chilled-eggs/bread/">Bread</a></li>
            </ul>
        </div>
    </div>
    <div class="tp-toggle-row">
        <!--<h3 class="">Drinks</h3>-->
        <h3 class="">Drinks</h3>
        <div class="tp-toggle-details ">
            <ul>
                <li><a href="/coupons/drinks/hot-beverages/">Hot Beverages</a></li>
                <li><a href="/coupons/drinks/juices/">Juices</a></li>
            </ul>
        </div>
    </div>
</div>

So when first page load, first ul will be active. When user click on li links in eg. Dairy, Chilled & Eggs it will load to /coupons/dairy-chilled-eggs/eggs/ archive and Dairy, Chilled & Eggs sidebar will be active. Please advise.

1 answer

  • answered 2021-06-18 15:01 MikeeeGeee

    If you use wp_list_categories() with your taxonomy instead then it supplies a current class to the LI that you can target with either CSS or JS.

    Something similar to this...

    <?php
    $args = array(
        'taxonomy' => 'coupons', // im assuming your taxonomy slug is coupons
        'hierarchical' => true,
        'title_li' => '',
    );
    ?>
    
    <ul>
        <?php wp_list_categories($args);?>
    </ul>
    

    wp_list_categories() documentation