WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] organize posts under category and display all categories on one page? (9 posts)

  1. Kevin Kwok
    Member
    Posted 4 years ago #

    http://img88.imageshack.us/img88/2852/helpee.jpg
    Diagram of what i mean.

    Basically I only apply one category per post and I would like the index page to display all the categories and the posts that go with them but organized by posts not by date/time, etc etc

    does anyone know if this is possible?

  2. MichaelH
    Member
    Posted 4 years ago #

    One possibility

    <?php
    //for each category, show posts
    $cat_args=array(
      'orderby' => 'name',
      'order' => 'ASC'
       );
    $categories=get_categories($cat_args);
      foreach($categories as $category) {
        $args=array(
          'orderby' => 'title',
          'order' => 'ASC',
          'showposts' => -1,
          'category__in' => array($category->term_id),
          'caller_get_posts'=>1
        );
        $posts=get_posts($args);
          if ($posts) {
            echo '<p>Category: <a href="' . get_category_link( $category->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $category->name ) . '" ' . '>' . $category->name.'</a> </p> ';
            foreach($posts as $post) {
              setup_postdata($post); ?>
              <p><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></p>
              <?php
            } // foreach($posts
          } // if ($posts
        } // foreach($categories
    ?>
  3. Kevin Kwok
    Member
    Posted 4 years ago #

    I will try this out! thank you!

  4. Kevin Kwok
    Member
    Posted 4 years ago #

    this works great! and is almost what i need. I am trying to apply it to my usual layout on my index page which displays a thumbnail, title of post and author.

    This is what the regular template looks like

    <div id="post-<?php the_ID() ?>" class="<?php
    			thematic_post_class();
    			if(function_exists('p75GetVideo')){
    		    if(p75GetVideo($post->ID)){
    				  echo " video";
    				}
    			}
    			?>" style="width:670px;">
    				<div class="entry-content">
    					<?php childtheme_post_header() ?>
                        <a href="<?php echo the_permalink() ?>">
                        <span class="slide-title"><?php echo get_post_meta($post->ID, 'designed-by', $single = true); ?>
                        <div style="width:145px; position:inherit; top:0px;" align="right"><?php echo the_title(); ?></div></span>
                        <img class="full-image" src="<?php if(get_post_meta($post->ID, 'full-image', $single = true)){echo get_post_meta($post->ID, 'full-image', $single = true);} else{bloginfo('url'); echo "/wp-content/themes/gallery/images/thumbnail-default.jpg";} ?>" width="150" height="113" alt="<?php echo the_title() ?>" /></a>
    				</div>
    			</div><!-- .post -->

    So I am attempting to mash that code and the one you provided into one so they work seamlessly. Your code does what I want but I also need it to work with the usual look I have going on with the site.

    when i try to mash it up wordpress seems to keep displaying the same posts over and over again

    see: ampersandbox.net/

  5. Kevin Kwok
    Member
    Posted 4 years ago #

    ok found out why the posts kept repeating i Kept it in a loop, so i took the code out of the loop and just placed it on the index page which stopped it from repeating.

    However i still cannot combine it with the presentation/ordination I want

  6. Kevin Kwok
    Member
    Posted 4 years ago #

    haha i think this is more of a document of my process, I refuse to give up. so hopefully this will someday help someone looking for the same thing. So I managed to style more of the code to get closer to what I want.

    I manged to...

    • place the rules in the correct places
    • tweakthe code michael gave me to display: category title and description
    • add div to the category name an description to style only that
    • position the category info in the correct spot
    • I even managed to have it stylize with my original thumbnail posts with title and author showing. and still be organized according to michael's code
    • However it does not want to stay insync with the position of the category and the rules....

    My code: (so far)

    <?php
    //for each category, show posts
    $cat_args=array(
      'orderby' => 'ID',
      'order' => 'DESC'
       );
    $categories=get_categories($cat_args);
      foreach($categories as $category) {
        $args=array(
          'orderby' => 'title',
          'order' => 'ASC',
          'showposts' => -1,
          'category__in' => array($category->term_id),
          'caller_get_posts'=>1
        );
        $posts=get_posts($args);
          if ($posts) {
            echo '
    
    		<div style="position:absolute;margin-bottom:20px;margin-top:-24px; margin-left:-10px;">
    		<hr color="#000000" size="0.5px" style="height:0.5px;width:659px;">
    		</div>
    
    		<div style="position:inherit; margin-left:680px; margin-top:-25px; width:200px">
    		<hr color="#000000" size="0.5px" style="height:0.5px;margin-bottom:20px;"/>
    
    		<div style="font-family:Courier New; font-size:16px; padding-left:10px; padding-right:10px;">
    		<a href="' . get_category_link( $category->term_id ) . '" title="' . sprintf( __( "" )) . '" ' . '>' . $category->name. ' '.$category->description.'</a>
    		</div></div><BR />';
            foreach($posts as $post) {
              setup_postdata($post); ?>
    
              <div id="post-<?php the_ID() ?>" style="width:670px;">
    				<div class="entry-content">
    					<?php childtheme_post_header() ?>
                        <a href="<?php echo the_permalink() ?>" rel="bookmark">
                        <span class="slide-title"><?php echo get_post_meta($post->ID, 'designed-by', $single = true); ?>
                        <div style="width:145px; position:inherit; top:0px;" align="right"><?php echo the_title(); ?></div></span>
                            <img class="full-image" src="
                            <?php if(get_post_meta($post->ID, 'full-image', $single = true))
                            {echo get_post_meta($post->ID, 'full-image', $single = true);} else{bloginfo('url');
                            echo "/wp-content/themes/gallery/images/thumbnail-default.jpg";} ?>" width="150" height="113" alt="<?php echo the_title() ?>" />
                            </a>
    				</div>
    			</div><!-- .post -->
    
              <?php
            } // foreach($posts
          } // if ($posts
        } // foreach($categories
    ?>

    screenshot of my site in case you read this and it has changed: click here

    if you can help , please do so! thank you =) and happy halloween

  7. Kevin Kwok
    Member
    Posted 4 years ago #

    well like i said this thread has just basically become me documenting my process to make this thing happen. so with the help of my friend here i finally figured it out heres my code. hope this helps someone down the road maybe years from now.

    <?php
    
    function printr($var)
    {
    	echo "<pre>"; print_r($var); echo "</pre>";
    }
    
    	?>
        	<div style="position:absolute;margin-bottom:20px;margin-top:-24px; margin-left:-10px;">
    		<hr color="#000000" size="0.5px" style="height:0.5px;width:659px;">
    		</div>
            <div style="width: 900px;">
    
        <?
    
    	$cat_args = array(
    					  	'orderby' => 'ID',
    						'order' => 'ASC'
    					  );
    	$categories = get_categories($cat_args);
    	foreach($categories as $category)
    	{
    		echo '<div>';
    		echo '<div style="float: right;">Category #'.$category->term_id.'</div>';
    		$args = array(
    					  	'orderby' => 'title',
    						'order' => 'ASC',
    						'showposts' => -1,
    						'category' => $category->term_id,
    						'caller_get_posts' => 1
    					  );
    		$posts = get_posts($args);
    		echo '<div style="float: left; width: 660px;">';
    		foreach($posts as $post)
    		{
    			setup_postdata($post);
    			childtheme_post_header();
    			echo "<a href=\"".$post->guid."\" rel=\"bookmark\">";
    			echo '<div style="float: left; width: 150px; margin-right: 12px;">';
    
    			if(get_post_meta($post->ID, 'full-image', $single = true))
    				echo '<img class="full-image" src="'.get_post_meta($post->ID, 'full-image', $single = true).'" width="150" height="113" />';
    			else
    				echo '<img class="full-image" src="'.bloginfo('url').'" width="150" height="113" />';
    				echo '<div style="height:50px;">
    						<div style="float: left;">'.get_post_meta($post->ID, 'designed-by', $single = true).'</div>
    						<div style="float: right;">'.$post->post_title.'</div>
    						<div style="clear: both;"></div>
    					  </div>';
    			echo '</div>';
    			echo '</a>';
    		}
    		echo '</div>';
    		echo '<div style="clear: both;"></div>';
    
    		echo '</div>';
    
    		echo '<div style="position:absolute; margin-left:-10px;height: 1px; width: 660px; background-color: #000000; margin-top:-5px; margin-bottom: 15px;"></div>';
    	}
    
    ?>
            </div>
  8. five19
    Member
    Posted 4 years ago #

    Hey there, this post solved a huge problem for me it was huge help.
    The original solution from MichaelH did the trick for me. but I was wondering how I could get the results in an unordered list format? This is my static markup:

    <ul id="pnav">
    <li><a href="#" title="You are viewing the Building Slabs & Footings category ">Category Name</a>
      <ul>
    	<li class="active"><a href="">Category post title</a></li>
      </ul>
    </li>
    
    <li><a href="#" title="More gallery images coming soon!">Category Name</a>
      <ul>
         <li><a href="" title="More gallery images coming soon!">Category post title</a></li>
         <li><a href="" title="More gallery images coming soon!">Back River</a></li>
         <li><a href="" title="More gallery images coming soon!">Russell Senate Building (Underpinning)</a></li>
      </ul>
    </li>
    </ul>

    I've tried different things but my php skills are not very good.

    Any help would be much appreciated

  9. rahulneo
    Member
    Posted 4 years ago #

    i too wants the same thing for my index page.
    where will i make these changes????
    I am using a theme ????
    will i change the the index page of the theme and paste this code there???
    help me out...

Topic Closed

This topic has been closed to new replies.

About this Topic