2011 Showcase Template – display full posts or excerpts

Featured Theme Forums CSS and PHP 2011 Showcase Template – display full posts or excerpts

This topic contains 6 replies, has 4 voices, and was last updated by  Zeaks 1 year, 10 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #13116

    Zeaks
    Participant

    By default twenty Eleven displays the first post as full and the rest with only the title in the showcase template.
    This will allow you to display excerpts or full posts instead of just the title.

    Open showcase.php and around like 188 find this block of code.

    // For all other recent posts, just display the title and comment status.<br />
    while ( $recent->have_posts() ) : $recent->the_post(); ?><br />
    <br />
    <li class="entry-title"><br />
    <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyeleven' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a><br />
    <span class="comments-link"><br />
    <?php comments_popup_link( '<span class="leave-reply">' . __( 'Leave a reply', 'twentyeleven' ) . '</span>', __( '<b>1</b> Reply', 'twentyeleven' ), __( '<b>%</b> Replies', 'twentyeleven' ) ); ?><br />
    </span><br />
    </li>

    As you can see, there isn’t a section for the_content, so we’ll add one, pretty much the same as content.php uses.

    <br />
    // For all other recent posts, just display the title and comment status.<br />
    while ( $recent->have_posts() ) : $recent->the_post(); ?><br />
    <br />
    <li class="entry-title"><br />
    <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'twentyeleven' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a><br />
    </li><br />
    <div class="entry-summary"><br />
    <?php the_content(); ?><br />
    </div><!-- .entry-summary -->

    What we did was, move the .entry-title closing tag under the title, then add the code to display the content of the post, then removed the comment links below it. If you would rather display excerpts just replace the_content with the_excerpt.

    Since this is slightly different than the regular content template, adding this bit of CSS will space the title properly under the seperator.

    Code:
    section.recent-posts .other-recent-posts li { padding-top:1.3125em; }

    Example in screenshot
    [ATTACH]54[/ATTACH]

    #14161

    Beng
    Participant

    Zeaks, you are great!!! Again thank you so much for your assistance.

    #14162

    zeaks
    Keymaster

    Ppl like you get all the brains. I just get to say thanks for he asnewr.

    #14163

    zeaks
    Keymaster

    This is nice, and it works well..
    Except that the posts are not showing the “read more tag” ..
    Is there a solution for that??
    Thank you for your tips, very usefull to all the community!
    (the site i’m building on twenty teen :
    kurageart.com

    #14164

    Zeaks
    Participant

    Hi claudio, the excerpts should show the continue reading tag as it does in the screenshot. http://board.zeaks.org/attachments/webpage-showcase-png.54/

    Don’t forget to change the content tag with the excerpt tag if you want it to display excerpts.

    #14165

    EmMeerkat
    Participant

    Hi,

    This may be a very ‘for dummies’ question but how / where do you start to change the CSS? I have been through some tutorials and this page pretty nailed down my issue with the posts display on the homepage, but I am still not sure where to start to basically get into the CSS and get it cooking? I know an option would be to go with the customize prenium option of WP but the homepage is the only thing I want to change, so don’t think it is worth going for a yearly renewal package.

    Thanks in advance for your advices!

    #14166

    Zeaks
    Participant

    This involves more than just CSS so you wouldn’t be able to accomplish it on wordpress.com hosted. You should start off by creating a child theme, you’ll want to copy the font page template from Twenty Eleven to your child theme folder then edit that instead, then add the CSS to a new style.css in your child theme.

    Since you’re asking where the CSS edits should go, Ill assume your not familiar with child themes and you should read this before proceeding http://zeaks.org/create-a-wordpress-child-theme

    Please start a new thread for any questions not directly related to this topic, Thanks!

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.