WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] List of recent posts with excerpts? (4 posts)

  1. victorfq
    Member
    Posted 1 year ago #

    I'd like to apologize in advance if there's an obvious or easily found answer to my question, but I'm an absolute beginner when it comes to custom designs using WordPress as a platform. I have about 5 hours of experience with the platform, but I'm well acquainted with both CSS and HTML.

    Here's the thing - I'm currently working on the front page for this blog we're starting up. There are 4 boxes located in the main content area - 2 of which I want to list the 5 latest posts from their respective categories. All I want it to show is the post title and a short excerpt.

    I've been trying to read up on what The Loop is and how to work with it, but I'm just completely dumbfounded. It could be that I've structured my HTML in a way that's completely negligent to what the purpose of the site is... I really have no idea and I was hoping to get a few pointers here. I'm not asking for someone to do the work for me, I just can't seem to find the appropriate information to help me move on.

    Here's a screenshot to illustrate what I'm talking about.

    ...and here's part of the HTML for the box you can see. You probably won't need to take a look at the CSS, but if I'm wrong - please tell me and I shall provide.

    <div id="musik">
                 	<div class="bluebar"></div>
                    <div class="headline">
                    <p class="headline">>> MUSIK</p>
                    </div>
    
                    <div class="bullet1">
                    	<div class="readmore"></div>
                    	<h1 class="bullet-head">
                        	Post headline here.
                        </h1>
                        <hr class="bullet-hr" />
                        	<p class="bullet-intro">
                            	Excerpt right here.
                            </p>
    
                    </div>
    </div>
  2. wpismypuppet
    Member
    Posted 1 year ago #

    Hey victorfq... welcome to the world of WordPress. Hopefully the five hours you have vested are good ones with positive results. And it's really great to have CSS and HTML under your belt. One other thing you'll want to learn is PHP if you don't already know it. It's an OOP language and is the core of WordPress... it's good to know if you are doing a lot of custom things!

    To answer your question, you are looking for get_posts. It's a simple function that will, well, get posts according to a set of arguments you pass it. One parameter you'll want to use is "posts_per_page" and set that to 5 to get the 5 latest posts. But you'll see from it's default usage that 5 is already the default... so chances are you'll just need to use this line of code:

    $posts_array = get_posts( $args );

    After that, follow the example marked "Latest posts ordered by title" but of course customize the $args to fit your own needs. This example simply shows you how to "Loop" through your findings and display the results on the page.

    Let me know if you need some more help in setting this up!

  3. Evan Herman
    Member
    Posted 1 year ago #

    To grab the most recent posts from the database you are correct in assuming you must use the loop.

    Your loop will look something like this:

    <?php query_posts('cat=5&posts_per_page=5'); ?>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
       <?php the_excerpt(); ?>
    <?php endwhile; endif; ?>

    Where 'cat=5' is the category ID of the posts you want to display, and 'posts_per_page=5' is limiting the number of posts displayed to only 5 (this can be increased or decrease to the need of your site).

    <?php the_excerpt(); ?>

    grabs the excerpt of the posts within that loop, so this loop will grab and display the_excerpt of 5 of the most recent posts in category 5.

    You can also get the ID of a specific category by going in to the Admin Dashboard section of your site.
    1. Select Posts > Categories
    2. Select the category you would like to check
    3. Check the URL, the ID will be listed here an example would be -
    http://www.web-site-address.com/wp-admin/edit-tags.php?action=edit&taxonomy=category&amp;tag_ID=5&post_type=post

    The section in bold is the ID for the specific category you have clicked.

    I hope this helps a bit

  4. victorfq
    Member
    Posted 1 year ago #

    I managed to figure it out and it's working just perfectly - you're both lifesavers! Thank you so much for your help!

    Right now I'm trying to make the category view look different but I can't manage to get the posts show up correctly. I tried making it display all of the posts from one specific category ordered by date in descending order, but it just picks a post that isn't the latest nor the first and displays it as the only one.

    The code for my category.php file looks like this:

    <?php get_header(); ?>
    <div id="superwrap">
    <div id="outerwrapper">
    
    <?php if ( have_posts() ) : ?>
    <div class="the_posts">
    <?php
    	$category_description = category_description();
    	if ( ! empty( $category_description ) )
    		echo '<div class="archive-meta">' . $category_description . '</div>';
            get_template_part( 'loop', 'category' );
    ?>       
    
    <?php
    /* Start the Loop */
    while ( have_posts() ) : the_post();
    
    	/* Include the post format-specific template for the content. If you want to
    	* this in a child theme then include a file called called content-___.php
    	* (where ___ is the post format) and that will be used instead.
    	*/
    	get_template_part( 'content', get_post_format() );
    
    endwhile;
    ?>
    
        	<div class="the_post-header">
                <h1 class="post-headline">
    				<a href="<?php the_permalink(); ?>"><?php the_title(); ?>
                </h1>
            </div>
    
            <div class="the_post-content">
    			<h3 class="post-text">
    
    				<?php the_content(); ?>
    
                </h3>
        	</div>
    
    <?php else : ?>
    <?php get_template_part( 'content', 'none' ); ?>
    <?php endif; ?>
    </div>
    <!-- end wrappers -->
    </div>
    </div>
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    ...and here's a screenshot of it. Please ignore the SoundCloud shortcode ;)

Topic Closed

This topic has been closed to new replies.

About this Topic