Popularized by Matt, Asides are now craved by many bloggers. The intention of Asides is to display brief (one-liner) Posts in a certain way, distinct from regular Posts.

Asides are commonly implemented by assigning certain Posts (aside Posts) into the a specific category, which will not be assigned to any other (non-aside) Posts. Moreover, an aside Post is usually enclosed in HTML list item tags (<li>) as part of an unordered list (<ul>).

An instruction has been published and the following is the walkthrough to have Asides in a WordPress installation.

1. <?php get_header(); ?>
2.  
3. <div id="content">
4.  
5. <?php if( have_posts() ) : ?>
6.  
7. <?php
8. function merge_lists( $str ) {
9. return preg_replace( '|</ul>\s*<ul class="asides">|', '', $str );
10. }
11. ob_start( 'merge_lists' );
12. ?>
13.  
14. <?php while( have_posts() ) : the_post(); ?>
15.  
16. <?php if( in_category( 6 ) && !is_single() ) : ?>
17.  
18. <ul class="asides">
19. <li id="post-<?php the_ID(); ?>"><?php echo wptexturize($post->post_content); ?></li>
20. </ul>
21.  
22. <?php else : ?>
23.  
24. <div class="post" id="post-<?php the_ID(); ?>">
25. <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
26. <div class="meta"><?php the_category( ', ' ); ?> <?php the_author(); ?> <?php the_time('F jS, Y'); ?></div>
27. <div class="entry">
28. <?php the_content(); ?>
29. </div>
30. </div>
31.  
32. <?php endif; ?>
33.  
34. <?php endwhile; ?>
35.  
36. <?php else : ?>
37.  
38. <div class="error">
39. <h2>Not Found</h2>
40. <p>Sorry, but you are looking for something that isn't here.</p>
41. <?php include( TEMPLATEPATH . '/searchform.php' ); ?>
42. </div>
43.  
44. <?php endif; ?>
45.  
46. </div>
47.  
48. <?php get_footer(); ?>

The implementation of Asides takes minor modification of the Default Loop. The first thing that needs to be done is to create a specific asides category and note the id of that category.

Fig. 1

In this example (Fig. 1), the Asides category is named Inline Function and it has category id of 6. Thus, inside the Loop on line 16, the Posts of category id of 6 are treated differently from the rest of Posts; line 10-20 shows how aside Posts are to be displayed.

On line 8-11 above, a block of code to merge adjacent unordered lists into one is implemented. Without it, the HTML output will have an unordered list for each aside Posts, which is not ideal.

• <ul class="asides">
• <li id="post-6">Morbi <code>++var</code> nonummy ligula sit <code>var++</code> amet wisi aliquet lobortis.</li>
• </ul>
• <ul class="asides">
• <li id="post-7">Sed turpis dui, viverra quis, accumsan in, porttitor ut, wisi <code>protected</code>. Vestibulum id sem semper risus semper interdum.</li>
• </ul>

What’s better is to merge adjacent aside Posts into one unordered list.

• <ul class="asides">
• <li id="post-6">Morbi <code>++var</code> nonummy ligula sit <code>var++</code> amet wisi aliquet lobortis.</li>
• <li id="post-7">Sed turpis dui, viverra quis, accumsan in, porttitor ut, wisi <code>protected</code>. Vestibulum id sem semper risus semper interdum.</li>
• </ul>