Title: Target First Post In Loop
Last modified: August 20, 2016

---

# Target First Post In Loop

 *  Resolved [Connor Crosby](https://wordpress.org/support/users/ccmovies/)
 * (@ccmovies)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/)
 * I am making a theme and want to have the first post look a little different than
   the rest of the posts. What would be the best way to target the first loop in
   the post on the first page only?
 * I know that there are tutorials online, but each tutorial I look at they suggest
   something different. Plus, a lot of them are a few years old, and I am not sure
   if much has changed since then.
 * FYI, the theme will be used for my own site and will be running the latest version
   of WordPress, so no need for legacy support.
 * Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [coopersita](https://wordpress.org/support/users/coopersita/)
 * (@coopersita)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/#post-3098857)
 * How about a CSS only approach. I’d have to see your code for an exact selector,
   but it would be something like:
 *     ```
       #content article:first-child {
            /* Your CSS here */
       }
       ```
   
 * Then you can also do things like this:
 *     ```
       #content article:first-child .title {
            /* Your CSS here for the title */
       }
       ```
   
 * The only problem with this approach is that it will only work IE8+ (IE7 is buggy.)
 * You could use a PHP approach, but that would require touching your loop. Probably
   adding a counter, to determine whether the post is the first, and add a special
   class, if it is. It’s not a big thing to do, but I would try CSS first, test 
   in IE7, and see if it holds.
 *  Thread Starter [Connor Crosby](https://wordpress.org/support/users/ccmovies/)
 * (@ccmovies)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/#post-3098859)
 * I’d rather not use CSS. This will create some problems with other pages on my
   site. PHP is fine. I actually have not began coding yet. I figured I would need
   to use a counter, I just don’t really know how to do it. Any help would be much
   appreciated! 🙂
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/#post-3098883)
 * > way to target the first loop in the post on the first page only?
 * in a default loop, there is a lop counter variable which starts with zero for
   the first post:
 * `$wp_query->current_post`
 * plus check for the first page of posts using `is_paged()` [http://codex.wordpress.org/Function_Reference/is_paged](http://codex.wordpress.org/Function_Reference/is_paged)
 * in total:
 * `if( $wp_query->current_post == 0 && !is_paged() ) { /*first post*/ }`
 *  Thread Starter [Connor Crosby](https://wordpress.org/support/users/ccmovies/)
 * (@ccmovies)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/#post-3098909)
 * [@alchymyth](https://wordpress.org/support/users/alchymyth/) ah that’s it! Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Target First Post In Loop’ is closed to new replies.

## Tags

 * [First post](https://wordpress.org/support/topic-tag/first-post/)
 * [loop](https://wordpress.org/support/topic-tag/loop/)
 * [php](https://wordpress.org/support/topic-tag/php/)

 * 4 replies
 * 3 participants
 * Last reply from: [Connor Crosby](https://wordpress.org/support/users/ccmovies/)
 * Last activity: [13 years, 8 months ago](https://wordpress.org/support/topic/target-first-post-in-loop/#post-3098909)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics