Showing posts from a Category by eckert
If you are looking to show a list of posts from a specific category on a page, this is how.
You need to make a page template first. If you do not know how to do that, check out THIS TUTORIAL first.
Then add this code into your php file:
<div id="productcats"> <?php rewind_posts(); ?> <h2><a href="http://yourdomain.com/?cat=XXX">TITLE OF CATEGORY</a></h2> <?php query_posts('category_name=xxxxxxxxxxxx&order=dsc&showposts=12'); ?> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a> <br clear="all"><br /> <?php endwhile; ?> <?php endif; ?> </div>
You are going to want to change everything above in red. First, insert the appropriate category number value. Then put in whatever you want this grouping called. Next is the actual slug name for the category and how many posts you want to show. I currently have the number set to 12, but you can change that.
The div this is all situated in is called “productcats”. You can change this id to whatever you want and then style it accordingly.
Now, this is all cool, but you might want to have an image associated with each post. First of all, make sure you know how to use CUSTOM KEYS.
Create a custom key within your post. For this example, the custom key will be called “thumbnail”. Look at the following code:
<div id="productcats"> <?php rewind_posts(); ?> <h2><a href="http://yourdomain.com/?cat=XXX">TITLE OF CATEGORY</a></h2> <?php query_posts('category_name=xxxxxxxxxxxx&order=dsc&showposts=12'); ?> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div id="thumb"> <a href="<?php the_permalink() ?>"><img src="<?php $key="thumbnail"; echo get_post_meta($post->ID, $key, true); ?>"></a> </div> <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a> <br clear="all"><br /> <?php endwhile; ?> <?php endif; ?> </div>
I have the div with the thumbnail called “thumb”. This allows you to style it however you like. I generally style it with a float: left; margin: 5px 10px 5px 5px;. This lets the text push to the right side of your image. Feel free to mess with it and fit it to your liking.
Also, don’t feel the need to stop here. You can do lots of interesting things with custom keys or by pulling in other info from your post like timestamps, author, category or any other meta data
Tags: category, custom keys, lists, page templates, Wordpress