Last active
December 12, 2017 15:08
-
-
Save ksascomm/03765ed417becffc7ee846e5a808cff5 to your computer and use it in GitHub Desktop.
Add active class to tabs and accordions while looping categories
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* | |
Template Name: Bulletin Board - Undergrad | |
*/ | |
get_header(); ?> | |
<?php get_template_part( 'template-parts/featured-image' ); ?> | |
<div class="main-container"> | |
<div class="main-grid"> | |
<main class="main-content"> | |
<?php while ( have_posts() ) : the_post(); ?> | |
<?php get_template_part( 'template-parts/content', 'page' ); ?> | |
<?php endwhile;?> | |
<ul class="tabs" data-tabs id="example-tabs"> | |
<?php | |
// counter for ul.tabs | |
$i=0; | |
$bulletin_types = get_object_taxonomies( 'bulletinboard' ); | |
foreach( $bulletin_types as $bulletin_type ) : | |
$terms = get_terms( $bulletin_type ); | |
foreach( $terms as $term ) : | |
$i++; ?> | |
<li class="tabs-title <?php // only for the first one, add .is-active | |
if($i == 1) { echo ' is-active'; } ?>"><a data-tabs-target="panel-<?php echo $term->slug ;?>" href="#panel-<?php echo $term->slug ;?>"><?php echo $term->name ;?></a></li> | |
<?php endforeach;?> | |
</ul> | |
<div class="tabs-content" data-tabs-content="example-tabs"> | |
<?php foreach( $terms as $term ) : ?> | |
<?php $bulletins = new WP_Query( array( | |
'taxonomy' => $bulletin_type, | |
'term' => $term->slug, | |
));?> | |
<?php if( $bulletins->have_posts() ): | |
// move the while up | |
while( $bulletins->have_posts() ) : $bulletins->the_post(); | |
// reset the counter | |
$i=0; ?> | |
<div class="tabs-panel<?php // again add .is-active only for first | |
if($i==0) { echo ' is-active'; } ?>" id="panel-<?php echo $term->slug ;?>"> | |
<ul class="accordion" data-accordion data-allow-all-closed="true"> | |
<li class="accordion-item" data-accordion-item> | |
<a href="#" class="accordion-title"><?php the_title();?></a> | |
<div class="accordion-content" data-tab-content > | |
<h1><?php the_title();?></h1> | |
<h3>Posted: <?php the_date(); ?></h3> | |
<?php the_content(); ?> | |
</div> | |
</li> | |
<?php endwhile; ?> | |
</ul> | |
</div> | |
<?php endif;?> | |
<?php endforeach;?> | |
</div> | |
<?php endforeach; ?> | |
</main> | |
<?php get_sidebar(); ?> | |
</div> | |
</div> | |
<?php get_footer(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment