Grouped by Category

Simply displaying a list of categories may not attract readers to go further clicking the links. To give equal exposure to older, noteworthy Posts in other categories, especially when there is sparse posting in that category, another view of Posts is needed.

Grouping by category lays out Posts of same category under one heading, the category name.

  1. <?php get_header(); ?>
  2.  
  3. <div id="content">
  4.  
  5. <?php $posts = get_posts( "category=2&numberposts=3" ); ?>
  6. <?php if( $posts ) : ?>
  7.  
  8. <div class="section" id="modernScience">
  9. <h2>Modern Science</h2>
  10. <ul>
  11. <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
  12.  
  13. <li><span class="date"><?php the_time('F j'); ?></span> <a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></li>
  14.  
  15. <?php endforeach; ?>
  16. </ul>
  17. </div>
  18.  
  19. <?php endif; ?>
  20.  
  21. <?php $posts = get_posts( "category=3&numberposts=3" ); ?>
  22. <?php if( $posts ) : ?>
  23.  
  24. <div class="section" id="lifestyle">
  25. <h2>Lifestyle</h2>
  26. <ul>
  27. <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
  28.  
  29. <li><span class="date"><?php the_time('F j'); ?></span> <a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></li>
  30.  
  31. <?php endforeach; ?>
  32. </ul>
  33. </div>
  34.  
  35. <?php endif; ?>
  36.  
  37. <?php $posts = get_posts( "category=4&numberposts=3" ); ?>
  38. <?php if( $posts ) : ?>
  39.  
  40. <div class="section" id="softwareDesign">
  41. <h2>Software Design</h2>
  42. <ul>
  43. <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
  44.  
  45. <li><span class="date"><?php the_time('F j'); ?></span> <a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></li>
  46.  
  47. <?php endforeach; ?>
  48. </ul>
  49. </div>
  50.  
  51. <?php endif; ?>
  52.  
  53. <?php $posts = get_posts( "category=5&numberposts=3" ); ?>
  54. <?php if( $posts ) : ?>
  55.  
  56. <div class="section" id="spaghettiCode">
  57. <h2>Spaghetti Code</h2>
  58. <ul>
  59. <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
  60.  
  61. <li><span class="date"><?php the_time('F j'); ?></span> <a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></li>
  62.  
  63. <?php endforeach; ?>
  64. </ul>
  65. </div>
  66.  
  67. <?php endif; ?>
  68.  
  69. <?php $posts = get_posts( "category=6&numberposts=10" ); ?>
  70. <?php if( $posts ) : ?>
  71.  
  72. <div class="section" id="inlineFunction">
  73. <h2>Inline Function</h2>
  74. <ul>
  75. <?php foreach( $posts as $post ) : setup_postdata( $post ); ?>
  76.  
  77. <li><?php echo wptexturize($post->post_content); ?></li>
  78.  
  79. <?php endforeach; ?>
  80. </ul>
  81. </div>
  82.  
  83. <?php endif; ?>
  84.  
  85. </div>
  86.  
  87. <?php get_footer(); ?>

The code above shows Loops as many as five. Each Loop is responsible for processing a set of Posts of a different category (Fig. 1); each set of Posts is first retrieved by get_posts() .

Categories list

Fig. 1

Line 5 fetches the first set of Posts. It passes to get_posts() the category of 2–the category id of Modern Science–and numberposts of 3. The variable $posts, then, contains at most 3 latest Posts of category Modern Science.

Line 11-15 loops thru the previously set variable $posts (Line 5) and output the desired corresponding Post data on line 13.

The rest of the code is simply the repeat of the first Posts retrieval and Loop (line 5-19) with different categories.

The last Loop (line 69-83), however, is treated slightly differently. Instead of displaying the link to the Post, which all previous Loops do, the last Loop displays the content of the Post (line 77). The last Loop process the category Inline Function which acts as regular news updates, whereas Posts of other categories are to be published sparingly.

49 thoughts on “Grouped by Category

  1. i’m jsut having a little bit of trouble with this, i think it’s all correct, except it gives me a

    Parse error: parse error, unexpected ‘=’ in /home/j0d/public_html/theolds/wp-content/themes/Tolds/home.php on line 5

    which i dont know why?

    here’s my home.php in .txt format

    http://theolds.j0d.net/layout/home.txt

    Thanks, gread bit of code by the way.

  2. Line 5 you have the following.
    <?php $posts = get_posts( “category=2&numberposts=1? ); ?>

    Replace with the following.
    <?php $posts = get_posts( "category=2&numberposts=1" ); ?>

  3. I love this code and have been looking for somehting like it for awhile. But I can’t get it to work. I’m currently using it on a “page” and evaluating the php with a plugin. Maybe a bad idea. So I want to know what you suggest. I’m not that great with php so please if you want to help, go slow!

    How do I make a template for a front page? And not so much that, I think I can build the template, but how do I fit it into the blog so that it’s the first page that people see, and then have various ways to get into the blog? How do I call it?

    Maybe I’m not making sense, let me know if you understand.

    Thanks for the help, Ryan

  4. I agree, this code is truely amazing. We will be using it for a newspaper-type website and use it to show the top posts. A very good snippet, thanks!!

  5. Hi! I can’t get the code to work. I have now tried a stripped down version to find the errors easier, but no luck. Heres the errormessage. Parse error: parse error, unexpected $ in /home/webjourn/public_html/wp-content/themes/almost-spring/index.php on line 10.

    You can find the code here: http://www.webjournalist.no/code.txt. Are you able to spot the errors? I would like to keep my “look” for the posts as in: http://www.webjournalist.no/code2.txt. How would I do that? Any help would be greatly appreciated. This code is exactly what I need to give my page a facelift :-)

  6. Kenneth,

    I don’t see anything wrong with your code. E-mail me the complete file that gives error as an attachment.

    j at rhymedcode dot net

  7. Hi Joshua! I resolved the problem, I just had to change all the “-s and ‘-s throughout the code. :-) Now I only have to make time for changing my design, so that I get the frontpage layout I wanted. Thanks for the great code! Kenneth

  8. Hiya! I’ve been trying to implement your code on an upcoming website. Thing is, I can’t get permalinks or the ‘more…’ tag to work with your code. I’m pretty new at WordPress, but I think the difference is that you use ‘foreach’ and the original WP loop uses while/endwhile. Do you know of a way to make Permalinks and ‘more…’ to work ?
    Thanks, Mathias.

  9. Hi, Mathias

    I still need to verify the problem with the “more” tag, but there’s no reason that the permalink does not work.

    Paste the whole file content to this site and come back with the link. I’ll see if I could spot your mistake.

  10. Thanks Joshua for helping me out!

    Ok, here’s the original “Deichnetz” WP-theme index page http://pastebin.com/528228 slightly modified by me to use your code snippet to display two different category views. I use the sidebar to display articles that are less important as well. Here’s the code for the sidebar: http://pastebin.com/528230
    I’m only displaying one category in the index.php theme page and use the sidebar to display the second category. The result can be viewed here: http://happy.haas.se

    If you click the the ‘more’ link in an article, the whole article is actually opend but it does this for *all* the articles with more-tags on my page.

    I should say that it is permalinks on older articles that doesn’t work. I’m guessing it has something to do with the number of articles I choose to display in the -tag ?

    The title of this article (http://happy.haas.se/?p=5) should be “Nytt år” (Yep, that’s Swedish alright for New Year!) but it doesn’t show up since the article is a bit older and I choose to display maximum two articles of that category in the sidebar.

    Thanks for your time,
    Mathias.

  11. What occurs to you is actually just a WP’s designed behavior. When you go to http://happy.haas.se/?p=5, the page you’re seeing is in single-post mode and, in turn, ALL the Posts with a “more” tag will be shown in its entirety.

    The common purpose in having two Loops in one template file is to have main content and side content (also known as “aside” or “miniblog”). For the side Posts, I’d suggest not to insert “more” tag.

    I have more detailed instruction for minibloging and the demo as well.

  12. Great loop, just what I am looking for for my index page. I have three categories all which need to be displayed and styled differently(not to mention showing different numbers of posts). This is perfect, but I have yet to get it functional. I am currently getting a t-string error. Any suggestions. I would post the code, however my site is down. I am happy to email it to you, or whatever is most convenient your the one doing me a favor.

    Thanks
    HHW

  13. Pingback: How to use WordPress to run a magazine, news website at Leon Kilat ::: The Cybercafe Experiments

  14. Txs for the useful information!

    How do I use the your script for an archive page, where I would like to post the articles for a specific week? Txs. markus

  15. Great.

    But i have a Problem with your code…if i use it with page.php, category.php or single.php i do not get the content from the paige.

    i show 4 post from 4 different categories just before the place where the main content should be. But it shows me only the content from the last post of the last category i defined before.
    How can i get the “original” content back in place?

  16. Pingback: Run a Webzine at After Issue Crawler

  17. Pingback: Source Color at After Issue Crawler

  18. Pingback: Untitled at After Issue Crawler

  19. Pingback: ifprojecttest at IF project

  20. Pingback: fiction at 픽션게임 in Seoul

  21. Pingback: Untitled at 픽션게임 in Seoul

  22. Pingback: f at ifproject

  23. Pingback: Magazine theme at fictiongame

  24. Pingback: ifproject » Untitled

  25. Pingback: Untitled at Headline 타짜포럼

  26. Pingback: Redo at Fictiongame

  27. Pingback: 이프 if project » Game

  28. @Mo (#25)

    I’m struggling with that, too. I can put the page content at the top, but once I’ve messed with the queries for the categories, I can’t seem to reset the query to have the content for the page *after* the category lists.

  29. Found it.

    At the top of the page, there’s probably a loop that displays the page header. Inside that loop, include the code
    $this_id = $wp_query->post->ID;

    … Then put the category stuff …

    At the end of the page (before the closing DIVs, get_footer(), etc.), put

    if ( $thispage = $wpdb->get_results(“SELECT ID, post_content FROM $wpdb->posts WHERE ID = “.$this_id)):
    echo $thispage[0]->post_content;

    endif;

    Caveat: WP 2.1.2 and I don’t pretend to understand much about the WP programming model — I just find code that works and copy it to a new context.

  30. Pingback: How to Run Wordpress as CMS at Technology Bites

  31. Pingback: How to use WordPress to run a magazine, news website « Catatan

  32. Pingback: Excuses, Wordpress, & Blogging | FPettit.com

  33. Pingback: Schweizer WordPress Magazin | Dank WordPress vom Blog zum Magazin

  34. Pingback: WordPress Archives that *works*: StepxStep Guide and Plugins

  35. Pingback: WordPress Archive that *works*: StepxStep Guide and Plugins | POLPDESIGN

  36. I bet you could combine all but last into one FOR loop… whenever
    there are many similar things done over and over they usually are candidates…
    Probably need an array of things to loop over…

  37. Pingback: Ehome » 博文 » How to use WordPress to run a magazine, news website

  38. Pingback: WordPress Archive that *works* « Los temas del Pelado

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>