• I’d like to add a specific post class for the latest post of every category in the loop, so I can target them with css.
    My index page displays a loop containing the latest 10 excerpts from posts of any of the three available categories. I’d like to stlyle the latest “category 1” post, the latest “category 2” post and the latest “category 3” post differently.
    Ho to do that?

Viewing 8 replies - 1 through 8 (of 8 total)
  • the following snippet grabs the cat ids of the current post; compares them with the cat ids that have been shown before; the new cat ids get memorized in an array.
    if one of your category ids is in this array, the corresponding styled post gets shown.

    <?php if (have_posts()) :
    $category_1_id = 1; //your cat ids
    $category_2_id = 9;
    $category_3_id = 52;
    $cats_already_been = array();
    while (have_posts()) : the_post(); ?>
    
    <?php  $cats = wp_get_post_categories($post->ID);
    $latest_cat_id = array();
    
      foreach($cats as $cat) :
      if(!in_array($cat,$cats_already_been)) { $latest_cat_id[] = $cat; array_push($cats_already_been,$cat); }
      endforeach; ?>
    
    <?php if( in_array($category_1_id, $latest_cat_id) ) { ?>
    <!--style for latest category 1 post-->
    <?php } elseif( in_array($category_2_id, $latest_cat_id) ) { ?>
    <!--style for latest category 2 post-->
    <?php } elseif( in_array($category_3_id, $latest_cat_id) ) { ?>
    <!--style for latest category 3 post-->
    <?php } else { ?>
    <!--style for all other post-->
    <?php } ?>
    
    <?php endwhile;
    else: ?>
    <!--post not found-->
    <?php endif; ?>
    Thread Starter tictactau

    (@tictactau)

    Thank you alchymyth, but it doesn’t seem to work… Here is my index template…

    <?php get_header(); ?>
    	<div id="first-col">
    		<div class="section">
    			<div class="section-header">
    				<h2>Ultime note</h2>
    				<!-- <span class="description">dal mucchio</span> -->
    			</div>
    
    			<div class="section-content">
    				<?php if (have_posts()) : ?>
    				<?php while (have_posts()) : the_post(); ?>
    
    				<div <?php post_class(); ?>>
    					<div class="post-header">
    						<h3><a href="<?php the_permalink() ?>" rel="bookmark" title="Collegamento a <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h3>
    						<p><em>Scritto da</em> <?php the_author_posts_link(); ?></p>
    					</div>
    
    					<div class="post-content">
    						<?php the_excerpt('Read the rest of this entry »'); ?>
    					</div>
    
    					<div class="post-meta">
    						<ul>
    							<li><em>Pubblicato il</em> <?php the_time('j F Y') ?></li>
    							<!-- <li><?php the_category(',') ?></li> -->
    							<li><a href="<?php the_permalink(); ?>#partecipa"><?php comments_number('Lascia un commento', '1 Commento', '% Commenti'); ?></a></li>
    							<?php edit_post_link('Edit', '<li>', '</li>'); ?>
    						</ul>
    					</div>
    				</div>
    
    				<?php endwhile; ?>
    
    				<?php if (show_posts_nav()) : ?>
    				<div class="page-nav">
    					<span class="next"><?php next_posts_link('<span class="arrow">»</span><em>Dopo</em> Note Successive') ?></span>
    					<span class="previous"><?php previous_posts_link('<span class="arrow">«</span><em>Prima</em> Note Precedenti') ?></span>
    				</div>
    				<?php endif; ?>
    
    				<?php else : ?>
    
    				<div class="post">
    					<div class="post-header">
    						<h3>Qui non c'è un fico secco!</h3>
    					</div>
    
    					<div class="post-content">
    						<p>La verità è che non ho ancora scritto nulla che sia degno di essere pubblicato. Forse è colpa mia, per aver eseguito un aggiornamento in maniera un po' maldestra, forse ricordi male l'indirizzo dell'archivio che volevi raggiungere, oppure stai tirando a indovinare. Ad ogni modo, qui non c'&egrave proprio nulla di interessante da leggere.</p>
    						<p><em>Rilassati e non perderti d'animo</em>. Cerca di ritrovare la bussola usando i collegamenti proposti sul menu di navigazione in alto e sulle barre laterali a destra, oppure <a href="/informazioni/">contattami</a>.</p>
    					</div>
    				</div>
    
    				<?php endif; ?>
    			</div>
    		</div>
    	</div>
    
    	<hr />
    
    <?php include( TEMPLATEPATH . '/second-col.php' ); ?>
    <?php include( TEMPLATEPATH . '/third-col.php' ); ?>
    <?php get_footer(); ?>

    How should I integrate your snippet? Maybe I did something wrong..

    the previous structure was made to allow totally different html structure for each of the posts;

    however, this new version is somehow simpler:

    http://wordpress.pastebin.com/zcVMGWC8

    the code integrated into your index.php will just add a class to the latest post of each category; so you could use these styles:

    .cat-1-latest { ... }
    .cat-2-latest { ... }
    .cat-3-latest { ... }

    you need to add the category ids of these three categories into the code.

    Thread Starter tictactau

    (@tictactau)

    wow… genius!
    Also, I learned I should use pastebin…
    So… 1 big help + 1 handy tip == Thousands Thank You!! It works!

    😀

    you are welcome 😉

    yes, the pastebin is actually a great tool to exchange code; it makes reading and changing it quite easy.

    it would be nice to see your project in action, sometimes …

    Thread Starter tictactau

    (@tictactau)

    Oh, sure!! sorry… just getting the grip with wp… it’s a work in progress, but you can see how it’s shaping up here: http://smellslikealmonds.com
    It’s built to be my really personal blog, so nothing too fancy. And by now, content is dummy for testing purposes.

    BTW, could I ask you if I can use category titles instead of category IDs in the code?

    Thank you again..

    wordpress has a function to get the category id from the name:

    http://codex.wordpress.org/Function_Reference/get_cat_ID

    you could use it in here:

    <?php //new code block 1
    //set your three category ids here
    $category_1_id = get_cat_ID( 'Category 1 Name' ) ;
    $category_2_id = get_cat_ID( 'Category 2 Name' ) ;
    $category_3_id = get_cat_ID( 'Category 3 Name' ) ;
    $cats_already_been = array();
    //end of new code block 1
    ?>
    Thread Starter tictactau

    (@tictactau)

    …not a man… an X-man… Bold&Brave 😀

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Adding a specific class to the latest post in a category’ is closed to new replies.