Posted 2 years ago #
Yes I have wordpres version 2.2 and I'm trying to style the most recent post differently than the rest of the post that appear on the homepage.
Im inside the index.php file and I need some help on what php code would conditionally style only the most recent post differently than the rest of the post
Posted 2 years ago #
Maybe there's an easier way to do this, but try this:
Before the loop begins, maybe right after get_header(), paste this in:
<?php $i = 1; ?>
And then right before the endwhile;, on the line right above, paste this in:
<?php $i++; ?>
Next, right after the loop begins (i.e. after the_loop()), paste this in:
<?php if ( 1 == $i ) { $firstclass="firstpost"; } ?>
Now, find where your post's HTML begins. Probably something like <div class="post">. You want to give the first post an additional class, so that it says <div class="post firstpost"> or something. Assuming that it looks like <div class="post">, you would write
<div class="post<?php echo $firstpost; ?>">
Now you can just edit your CSS to modify div.firstpost however you want.
Posted 2 years ago #
adam thank you for your help but I title the post the wrong way. I titled it using 'the first post
actually I needed to style the most recent post.
It will do exactly that :)
("first" here being the first displayed on the top = the latest)
Posted 2 years ago #
moshu or adam:
can you explain a little about the code Im fairly new to php programming and is trying to understand php and program with it as I go
like why did he increment the $i and
how does wp know that it was the most recent post using that code?...does the content() load a certan way? or something..
Posted 2 years ago #
One correction. That's what I get for not testing the code I post.
<?php if ( 1 == $i ) { $firstclass="firstpost"; } ?>
should be
<?php if ( 1 == $i ) { $firstclass="firstpost"; }
else{ $firstclass = ''; } ?>As for the explanation: I increment the $i so that you only get that "firstpost" class once. Otherwise you'll get it every time.
And since wp's loop process the posts from most recent working back, and this code applies an additional class only to the first post processed, well, there you go.
Posted 1 year ago #
I'm using WP 2.3.x, is this way still can be used? Because I've tried to follow this step one by one but it didn't work.
Posted 1 year ago #
I'm using WP 2.3.x
Irrelevant. The code I gave isn't WP specific, it's just basic PHP.
What do you mean that it didn't work? Do you mean that it didn't output a unique class for the first post, or do you mean that you haven't added anything to your CSS yet?
This is a clearer explanation of the above:
Posted 1 year ago #
It didn't output a unique class for the first post even when I styled it with css..
Posted 1 year ago #
Paste a copy of whatever theme file you edited into http://wordpress.pastebin.ca/
This is the theme's index.php we're talking about, right?
Also, what's your URL?
Posted 1 year ago #
Hi Adam,
Followed your instructions at your website and it worked perfectly, and I thank you for posting it.
The only issue now is that if a user chooses to view older posts from the index page, the second page of posts shows the top entry as the latest post when it's only the newest post on that particular page. Is there a workaround for this that ignores the firstPost class when 'index.php' becomes 'index.php/page/2/' or similar?
Thanks again for the tutorial, fingers crossed on this fix :)
Posted 1 year ago #
Change <?php $i++; ?> to
<?php
if (is_home() && !is_paged())
$i++;
?>
Posted 1 year ago #
Adam, thanks for all of your help on this issue. I to was having the same issue as Traceyshaw, but after making the change that you mentioned above, my first on the first page displays as it should, however, every post on every other page than the first displays like the first post on the first page...I've gone back to my original way, the first post on each page displays differently as other posts. I just want the first post on the first page to display differently...Any ideas? Your help is appreciated.
This topic has been closed to new replies.
