Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I am building a custom (child) theme and I want to style the first post of my loop in a different way than the others (bigger image, different position of some stuff).

Which is the best way of doing it? My "problem" is that my theme has support for different post types and the style would vary depending on the type of content, so I want to avoid repeating code as much as possible (i.e. using a function).

As I am a bit more used to OOP, my ideal scenario would be passing a variable to the view and check it in the loop of each content-type (that way I can re-use most of the code from the TwentyEleven templates). From what I know, that is not possible (please correct me if I am wrong).

For now, what I do is this:

function electric_index_loop($readMore = 0) {

$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
    //Excluimos los "miniposts" (citas, estados, enlaces...) del listado
    'tax_query' => array(
        array(
            'taxonomy' => 'post_format',
            'field' => 'slug',
            'terms' => array('post-format-aside', 'post-format-link',
                'post-format-status', 'post-format-quote'),
            'operator' => 'NOT IN'
        )
    ),
    'posts_per_page' => 5,
    'paged' => $paged
);

// The Query
query_posts($args);

// The Loop
if (have_posts()) {
    $post_count = 0;
    global $more;
    $more = $readMore; // 0 fuerza que se muestre sólo el "excerpt", 1 fuerza que se muestre todo el contenido
    twentyeleven_content_nav('nav-above');
    while (have_posts()) {
        the_post();
        if ($post_count == 0) {
            get_template_part('highlight', get_post_format());
        } else {
            get_template_part('content', get_post_format());
        }
        $post_count++;
    }
} else {
    ?>
    <article id="post-0" class="post no-results not-found">
        <header class="entry-header">
            <h1 class="entry-title"><?php _e('Nothing Found', 'twentyeleven'); ?></h1>
        </header><!-- .entry-header -->

        <div class="entry-content">
            <p><?php _e('Apologies, but no results were found for the requested archive. Perhaps searching will help find a related post.', 'twentyeleven'); ?></p>
            <?php get_search_form(); ?>
        </div><!-- .entry-content -->
    </article><!-- #post-0 -->
    <?php
}
wp_reset_query();}

As you see, I check the counter in the loop that I create in the function and ,if the current post is the first, I load a different template ("highlight"). I'd have to create different templates for the different types of content (which, in some cases sucks, because I can get all I need in some cases with just a CSS class).

Well, is there a better way of doing these? Perhaps a hook or something?

Thanks in advance!

share|improve this question

2 Answers 2

I think you can add an class to the [post_class()][1] function via Filter; the name, the string can you use form different values: tags or post title?

The follow example use the title of post and add this to the classes of post; if you use the post_class() function on post tag in markup. Also you can use other values for design this.

function fb_title_post_class( $classes ) {
    global $post;
    $classes[] = sanitize_title_with_dashes( get_the_title( $post->ID ) );
    return $classes;
}
add_filter( 'post_class', 'fb_title_post_class' );
share|improve this answer
    
That's interesting, I'll have to try it, though I don't know if it will fit my needs 100% –  Cmorales Feb 29 '12 at 18:07
    
If I add a filter... wouldn't I get that class with every post (every time post_class() is called)? I only want it for the first one. –  Cmorales Mar 4 '12 at 22:31
    
You can count about the Loop global $wp_query; echo $wp_query->current_post; and also you have an var for the result $wp_query->post_count You must add the logic befor return the new class to this filter; current exampel give always feedback to the post_class() –  bueltge Mar 5 '12 at 7:34
    
Sorry, but I don't understand the second part. Could you provide an example? –  Cmorales Mar 6 '12 at 12:57
up vote 0 down vote accepted

Ok, for now the best solution I've found is passing a global variable in my functions.php, as so:

while (have_posts()) {
        the_post();
        if ($post_count == 0 || is_sticky()) {
            global $highlight;
            $highlight = true;                
        }else{
            $highlight = false;
        }
            get_template_part('content', get_post_format());            
        $post_count++;
    }

And then, I check the variable in the views. That way I don't need to create more files:

global $highlight;
?>
<article id="post-<?php the_ID(); ?>" <?php $highlight == true ? post_class('highlight') : post_class(); ?>> 
(more code)

If somebody thinks there's a better solution than this, please let me know :)

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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