0

I need to have 8 of these on a single page. Each post list will be in its own numbered switch tab.

Is there a better, more efficient way of doing it?

<div id="tab1">
<div class="content">
    <ul>
        <?php
            // The Query
            query_posts( array ( 'category_name' => 'CV', 'posts_per_page' => -1 ) );

            // The Loop
            while ( have_posts() ) : the_post(); ?>

            <h3><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h3>
            <p><?php the_content(); ?></p>
        <?php endwhile;

            // Reset Query
            wp_reset_query();            
        ?>
    </ul>
</div><!-- / .content -->
</div><!-- / #tab1 -->

EDITED TO ADD FINAL CODE:

<?php
// getting only children of category ID 16
$categories = get_categories('child_of=16');
// do not need to check for empty categories
{
?>

<ul class="tabs">
<?php foreach ($categories as $c ) { ?>
    <li>
      <a href="#tab<?php echo $c->term_id; ?>">
        <img src="<?php bloginfo('template_directory'); ?>/images/logo-<?php echo $c->slug; ?>.png" alt="<?php echo $c->name; ?>" />
      </a>
    </li>
<?php } ?>
</ul> <!-- / .tabs -->

<?php } ?>

<?php { foreach ($categories as $c ) { ?>
<div id="tab<?php echo $c->term_id; ?>">
<a href="#" class="left-button"><img src="prev.png" alt="Prev" /></a>
<div class="content">
    <?php
    $q = new WP_Query( array( 'posts_per_page' => -1, 'cat' => $c->term_id ) );
    if ( $q->have_posts() ) : ?> <ul class="tabs-content"> <?php while( $q->have_posts() ) : $q->the_post();
    ?>
    <li>
      <h3>
      <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
      <?php the_title(); ?></a>
      </h3>
      <?php the_content(); ?>
    </li>
    <?php endwhile; ?> </ul> <?php endif; wp_reset_postdata(); ?>
</div><!-- / .content -->
<a href="#" class="right-button"><img src="next.png" alt="Next" /></a>
</div><!-- / #tab<?php echo $c->term_id; ?> -->
<?php } } ?>
2
  • What differ one tab from another, the category?
    – gmazzap
    Aug 1, 2013 at 4:44
  • Yes, all categories are different. And each tab header has a different image (logo).
    – Phantasmix
    Aug 1, 2013 at 4:48

1 Answer 1

1

If you have 8 categories, you need 8 queries. To improve your code use WP_Query instead of query_posts:

<?php
$categories = get_categories();
if ( ! empty($categories) ) {
?>
<ul class="tabs">
<?php foreach ($categories as $c ) { ?>
<li>
  <a href="#tab<?php echo $c->term_id; ?>">
    <img src="<?php bloginfo('template_directory'); ?>/images/logo-<?php echo $c->slug; ?>.png" alt="<?php echo $c->name; ?>" />
  </a>
</li>
<?php } ?>
</ul> <!-- / .tabs -->
<?php } ?>

<?php if ( ! empty($categories) ) { foreach ($categories as $c ) { ?>
<div id="tab<?php echo $c->term_id; ?>">
<a href="#" class="left-button"><img src="prev.png" alt="Prev" /></a>
<div class="content">
<?php
$q = new WP_Query( array( 'posts_per_page' => -1, 'cat' => $c->term_id ) );
if ( $q->have_posts() ) : ?> <ul> <?php while( $q->have_posts() ) : $q->the_post();
?>
<li>
  <h3>
  <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
  <?php the_title(); ?></a>
  </h3>
  <p><?php the_content(); ?></p>
</li>
<?php endwhile; ?> </ul> <?php endif; wp_reset_postdata(); ?>
</div><!-- / .content -->
<a href="#" class="right-button"><img src="next.png" alt="Next" /></a>
</div><!-- / #tab<?php echo $c->term_id; ?> -->
<?php } } ?>
11
  • Two things: 1) I think you missed <li>'s in there; 2) where would I assign category name or ID this way? Sorry, don't get it.
    – Phantasmix
    Aug 1, 2013 at 5:14
  • $category->term_id is the id, $category->name is the name. Now I'm updating code for the <li>. But in your code there is no <li>
    – gmazzap
    Aug 1, 2013 at 5:18
  • My mistake, I was deleting some code before sharing and li's were lost in the process.
    – Phantasmix
    Aug 1, 2013 at 5:31
  • Ah, I see what you did there. It doesn't work for me in this particular situation but useful anyway, thank you. I need to have more control over the look and tab ID's. ---- Would 8 instances of query_posts be very bad, or acceptable?
    – Phantasmix
    Aug 1, 2013 at 5:37
  • Consider that query_posts call WP_Query so you are the same thing, for that I don't understand what the matter. You can do with this code do whatever (and much more) you should do with 8 query_posts... What are you using for tab, bootstrap? jquery ui? or something else?
    – gmazzap
    Aug 1, 2013 at 6:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.