ThemeShaper Forums » Thematic


Stying the top most (latest) blog post

(10 posts)
  • Started 10 years ago by Senny
  • Latest reply from ScottNix
  • This topic is not resolved
  1. Senny

    Hey everyone, I just want to know how to go about editing the first post on the home page of your bog using thematic.

    I want the first post users see to be display differently, and then have a default look for other posts following. I've looked around and haven't found a solution for Thematic.
    ^like this, where the first post would always be in the purple box, then the other posts the alternate look.

    Thank you for any help and for your time.

    Posted 10 years ago #
  2. Roll your own index loop where you count posts and do something special to the first one. My example applies the 'sticky' selector to the first post since I don't use sticky posts; you would change it to whatever you like. My example also applies excerpts only to the home and category pages, you may not want that.

    function childtheme_index_loop()
    	/* Count the number of posts so we can insert a widgetized area */
    	$count = 1;
    	while ( have_posts() ) : the_post();
    		<div id="post-<?php the_ID() ?>" class="<?php thematic_post_class() ?><?php if ( $count == 1 && is_home() && get_query_var('paged') == 0 ) echo ' sticky' ?>">
    			<div class="calendar">
    				<span class="month"><?php the_time('M') ?></span>
    				<span class="day"><?php the_time('j') ?></span>
    			<?php echo thematic_postheader_posttitle() ?>
    			<div class="entry-content">
    				if ( is_home() || is_front_page() || is_category() )
    					echo apply_filters( 'thematic_post' , get_the_excerpt() );
    					<span><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title() ?>"> Read More ...</a>
    					</span><br /><br />
    			<?php wp_link_pages( 'before=<div class="page-link">' .__('Pages:', 'thematic') . '&after=</div>' ) ?>
    			<?php thematic_postfooter(); ?>
    		</div><!-- .post -->
    		<?php comments_template();
    		if ( $count == $thm_insert_position )
    add_action( 'thematic_indexloop' , 'childtheme_index_loop' );


    Posted 10 years ago #
  3. sowingseeds

    Other ways of achieving this could be:

    1. If you have enabled Thematic post class in functions: i.e. unchecking the line define('THEMATIC_COMPATIBLE_POST_CLASS', true);
    then each post will have a class added .p1, .p2, etc. That then would be a simple task of styling the post in stylesheet with .p1 {background....}.

    2. Another way is to add a class to the posts as follows:
    //adding classes to the post
    function addpost_class($class) {
    global $post, $posts;
    if ( is_home() && !is_paged() && ($post == $posts[0]) ) $class[] = 'firstpost';
    if ( is_home() && !is_paged() && ($post == $posts[1]) ) $class[] = 'secondpost';
    if ( is_home() && !is_paged() && ($post == $posts[2]) ) $class[] = 'thirdpost';
    //and so on to as many as you wish to add a specific class to
    return $class;
    add_filter('post_class', 'addpost_class');

    Posted 10 years ago #
  4. Senny

    Okay, I'll give it a try!

    Posted 10 years ago #
  5. Senny

    It seems neither one worked, I'm not sure what I did wrong, but I'm still not getting the classes to edit the first post.

    Can I ask where I am suppose to place the codes? I may have placed them in the wrong location?

    Posted 10 years ago #
  6. sowingseeds first answer is the easiest way go.

    Check your functions.php file in your child theme. By default it is commented out.

    You should be able to change

    // define('THEMATIC_COMPATIBLE_POST_CLASS', true);



    So just remove those two // brackets to uncomment the php and make it active. This is by far the easiest route. Once this is active, it will start adding classes to the post of ".p1, .p2, etc..". You want to then target those classes with .p1 in your CSS file.

    Posted 10 years ago #
  7. Senny

    Yeah that definitely is the easiest way to go about doing it but for some reason it just doesn't work for me, I even moved the function the the top of the list of functions and it still doesn't assign classes to each of the posts.

    Posted 10 years ago #
  8. sowingseeds

    Sorry to ask the obvious: you are using firebug or equivalent and can see that .p1 etc. is not assigned? Happy to take a look if you send a link.
    That you are using a child-theme?

    Posted 10 years ago #
  9. Senny

    Here is the link, and yeah, I've used the web developer toolbar and checked the source as well as edited the css, no effect. Thanks for your help.

    Posted 10 years ago #
  10. This is a case of actually modifying thematic itself. Looks like sowingseeds had maybe already figured out where the problem was by his last question. Since the thematic theme itself was modified, you may want to get the child theme thing down asap.

    Helgatheviking posted a good site for understanding Child Themes, but there is going to be some extra work now in that you will have to move over changes, maybe someone else can chime in who has had to move themes out of thematic (which is incorrect) and into a correct child theme.

    Posted 10 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.