show wordpress posts only under current category - wordpress

Question

i'm trying to build a navigation for a website, and i'm struggling with it. I'm trying to make a foldable navigation that shows only categories at first, when clicked, they link to the category, and show current category posts only.
I came this far:
<?php
// get all the categories from the database
$cats = get_categories();
// loop through the categries
foreach ($cats as $cat) {
// setup the cateogory ID
$cat_id= $cat->term_id;
// Make a header for the cateogry
echo '<h2><a href="./?cat='.$cat->term_id.'">'.$cat->name.'</h2>';
// create a custom wordpress query
query_posts("cat=$cat_id");
// start the wordpress loop!
if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php // create our link now that the post is setup ?>
<?php the_title(); ?><br>
<?php endwhile; ?> <?php endif; // done our wordpress loop. Will start again for each category ?>
<?php } // done the foreach statement ?>
The problem with this is: when i fill in the query so that it only takes the current cat, it displays current cat posts on both my categories.
this is what i want for the nav actually:
graphic design
Other Projects
when clicked on graphic design:
graphic design
Project 1
Project 2
Other Projects
when clicking on Other projects:
graphic design
Other Projects
Project 1
Project 2
so basically:
- when clicking from Index page to a category, only that category should expand
- when clicking the other category, the current category changes, so the previous category collapses and the other one expands.
and a bonus: is it possible, that when on a single post, there expands another level of info? for example, a few custom fields per post. like this:
graphic design
Other Projects
Project 1
custom field 1
custom field 2
…
Project 2
thank you very much

Answer 1

Try this code
<?php $article_categories = get_categories(array(
'child_of' => get_category_by_slug('graphic design')->term_id
));
$talentChildren = get_categories(array('child_of' => get_category_by_slug('Project 1')->term_id));
?>
<div id="content" class="narrowcolumn" role="main">
<?php if (have_posts()) : ?>
<div class="post-list">
<?php foreach($talentChildren as $talent): ?>
<?php
$talentSubChildren = new WP_Query();
$talentSubChildren->query(array('category_name' => $talent->slug));
?>
<h2><?php echo $talent->name; ?></h2>
<ul>
<?php while ($talentSubChildren->have_posts()) : $talentSubChildren->the_post(); ?>
<li>
<?php talent_thumbnail(); ?>
<h4>
<?php the_title(); ?>
</h4>
<p><?php the_excerpt(); ?></p>
read on »
</li>
<?php endwhile; ?>
</ul>
<?php endforeach; ?>
<?php if($wp_query->max_num_pages!=1):?>
<div class="pagination">
<?php previous_posts_link('« prev') ?>
<span class="current"><?php echo $wp_query->query['paged']; ?></span>
of <span class="total"><?php echo $wp_query->max_num_pages; ?></span>
<?php next_posts_link('next »') ?>
</div><!-- .pagination -->
<?php endif; ?>
</div>
<?php else : ?>
<h2 class="center">Not Found</h2>
<p class="center">Sorry, but you are looking for something that isn't here.</p>
<?php get_search_form(); ?>
<?php endif; ?>
</div>

Answer 2

Ive gotten a bit further, but i need some help now.
<?php
// get all the categories from the database
$cats = get_categories();
// loop through the categries
foreach ($cats as $cat) {
// setup the cateogory ID
$cat_id= $cat->term_id;
// Make a header for the cateogry
echo '<h2><a href="./?cat='.$cat->term_id.'">'.$cat->name.'</h2>';
// create a custom wordpress query
query_posts("cat=$cat_id"); ?>
<?php if (in_category($cat_id)) { ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php // create our link now that the post is setup ?>
<?php the_title(); ?><br>
<?php endwhile; ?> <?php endif; // done our wordpress loop. Will start again for each category ?>
<?php } else { ?>
<?php } ?>
<?php } // done the foreach statement ?>
So this is working now: it lists the posts per category, if in the current category, else it doesnt show anything.
now what i still want: i want to add something extra within the loop IF i'm on a single page. I have this code:
<?php wp_reset_query(); ?>
<?php if (is_single('84')) { ?>
Yes
<?php } else { ?>
no
<?php } ?>
But that would mean i have to break a query in the middle of a loop. and the is_single thing does not work inside a loop / without the query reset.
I want it looking like this with above code:
Graphic Design
project 1 (for example id=84)
Yes
project 2 (for example id=101)
No
thanks