1

Question: Category Display

I'm trying to create a header that pulls data from the most recent 3 posts in a specific category along with pulling the image associated for the most recent post (if there is one) to display. I can create the styling just fine, but I don't know how to reference and pull the post information. I don't want to do a loop because I don't want all posts.

I'm thinking of something along these lines.

POST IMAGE (overlayed with the title of the most recent post of a category, which is a link to that category, possibly referencing the date and time of the post) Under that, I want to put just text links to the post just prior to that within the category followed by a third link to the post prior to that one.

Are there specific tags to pull post titles and perhaps small post excerpts and display them like this?

Clarification: what I'm looking to do is redesign my main page so that the upper portion is broken into four sections, top left, top right, bottom left and bottom right. Each of these will be the image of the most recent post in specific categories overlaid by a link to the most recent post. Then, with each of these is a list of the next two posts in the category. The formatting is done through CSS, which I can handle, but I don't know how to pull posts from specific categories and how to pull only the most recent three.

  • Hi. If my answer helped solved this then please do consider accepting it. Accepting answers helps keep the site format tidy and if you're seen to reward your answers then your newer questions may get better attention too. – Andy Macaulay-Brook Aug 11 '16 at 21:55
0

You do want to "do a loop".

Within your header you want to make a fresh query for just those three posts and loop through them without upsetting the main query that you need further down each page.

Here's a standard loop calling three posts from your category:

$wpse_235359_query = new WP_Query( array( 

        'category_name' => 'your-category-slug',
        // should pull in posts from child categories too

        'posts_per_page' => 3 

    ) );

if ($wpse_235359_query->have_posts()) :

    while($wpse_235359_query->have_posts()) :
        $wpse_235359_query->the_post();

        /* show your post stuff here using standard
           template tags like the_title()
        */

    endwhile;

endif;

wp_reset_postdata();

Calling wp_reset_postdata at the end sets everything back nicely so the rest of your page behaves as expected.

You put this snippet of code anywhere in your theme files that you'd like to show this bundle of posts. That can be in a child theme if you're basing your theme upon another, or in the main theme files if you're building the whole theme.

Edit - additions from the comments to keep the comment list shorter

Call the variable $wpse_235359_query anything you like. Use the snippet multiple times with different categories if you wish.

Place it where you want, using a child theme so you can still update your parent theme. The child theme works by overriding whole template files in the parent. So you copy the parent header.php into the child theme, modify it, and the child header.php is used by WP instead of the parent header.php. A call to load header.php will always look in the child theme first.

Then to style the first differently, using HTML like this:

<div>
    <span class="MainCategoryHeader">
    <a href="http://www.example.com/">Permalink One</a>
        </span>
    <span class="MainCategoryHeader">
        <a href="http://www.example.com/">Permalink Two</a>
    </span>
    <span class="MainCategoryHeader">
        <a href="http://www.example.com/">Permalink Three</a>
    </span>
</div>

Apply CSS like this:

.MainCategoryHeader:first-child a { 
    background-color: #FFFFFF; 
    color: #FFFF00; 
} 
.MainCategoryHeader a { 
    background-color: #FFFFFF; 
    color: #000000; 
}

This has strayed a long way from WordPress and the main point of the original question now though. If you're happy that the WordPress part is solved then please do accept the answer, not just for my benefit but to keep the site tidy too.

  • Ok. Thanks. Does this go in the header php along with whatever html or span formatting I need? Or should this be put into a child theme header php file? And I can duplicate this particular code multiple times for each category I want to do this with? Do I need to rename any of these things (like "wpse_235359_query"? Or is that a necessary part of the code? – OscarGuy Aug 8 '16 at 21:45
  • It doesn't have to have a different variable name for each instance called? Can it be placed in a footer, but styled up to the top of the page or should I really put it into the header file? I use a universally available theme using CSS to modify and adjust everything on the page. It has a built-in CSS option that I can infuse my custom CSS into. That's why I was asking if a child theme would be better. If I change themes at some point just to play around with something, or the theme posts an update, I don't want to lose everything I've changed. – OscarGuy Aug 9 '16 at 3:53
  • @OscarGuy If parent theme provides update then you can't edit parent theme. Better option is either make changes in child theme or make changes in parent theme to remove update feature. – Rishabh Aug 9 '16 at 7:16
  • @Rishabh disabling updates is not a good idea – Andy Macaulay-Brook Aug 9 '16 at 9:14
  • Is it possible to create the child theme so that only part of the header is removed or do I have to take the contents of the original header.php and put it into the child theme file and modify it to fit my needs? – OscarGuy Aug 9 '16 at 11:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.