0

I'm working on a tabbed archive page for taxonomy terms.

Ultimately, I want each tab to show the 10 most recent posts for an individual post type with a "see all" link at the bottom of the tab that will direct visitors to a Post Type archive filtered by a taxonomy term.

I know I can achieve this relatively easily with multiple queries and something along the lines of:

<section class="tab" id="tab1">
    <?php $query1 ?>
    [loop content here]
</section>

<section class="tab" id="tab2">
    <?php $query2 ?>
    [loop content here]
</section>

[...]

For the templates in question, I'll only be using 4 tabs, but I'm wondering if there is a more efficient way to do this with a single query.

What I'd really like to output is something more like:

<article class="custom-type1">
    [Listing content]
</article>

<article class="custom-type2">
    [Listing content]
</article>

<article class="custom-type1">
    [Listing content]
</article>

<article class="custom-type3">
    [Listing content]
</article>

<article class="custom-type2">
    [Listing content]
</article>

[...]

Then I would use the tabs to turn visibility on/off for specific CSS classes. (I also think this second option would look nicer for visitors with JS disabled).

2
  • for visitors with JS disabled Do not try to please the absolute minimum which do not use JS. Jul 14, 2015 at 17:28
  • Why not? I've always felt that JS should enchance the user experience not define it.
    – Mike
    Jul 14, 2015 at 18:01

0

Your Answer

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

Browse other questions tagged or ask your own question.