treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Extracting First Pragraph in a Wordpress Post

  • here's my issue.
    for the theme we're building we cant use the more or excerpt features in wordpress. the whole post needs to be typed into the content area as a whole.

    we created a custom loop using query posts so that the most recent post in a category, that has the tag "featured" will appear in the featured area. all other posts are just headlines until you click on the more link. when clicking on more, regardless of styling, the full post is revealed on that same page. you never go to the single.php file.

    i need to extract everything within the first "<p>" "</p>" tags, display it under the headline next to the featured post image, and then when clicking "more" NOT show it in the expanded content area. here are some screen shots.

    http://img.skitch.com/20100517-brh8qmrdj8gs4imh776ejd5sfj.jpg

    http://img.skitch.com/20100517-dmgwupda5ebsm4a238sntmbipj.jpg

    as you can see in the first image. the featured post is comprised of a featured image/thumb nail. date, headline and intro paragraph.

    the second image when more is clicked the whole post is revealed.



    currently that paragraph is hard coded into the theme and the latin is in the post.

    once the post cycles to the styling below it needs to behave normally. While in the featured position however the first paragraph needs to be shown under the headline, and NOT shown in the area that expands when clicking more.

    hopefully thats not too confusing and makes sense.


    if anybody has any idea how to do this i would appreciate it. i'm also not using the traditional WP loop. we've created our own for some of the pretty unique needs of this theme. its serving more of a CMS than blogging purpose. here's the code i'm using:


    <div id=\"mainContent\">
    <?php
    $postcount = 0;
    $page = (get_query_var('paged')) ? get_query_var('paged') : 1;
    query_posts( 'paged=$page&showposts=9&tag=Featured' );
    if (have_posts()) { while (have_posts()) { the_post();
    if( $postcount == 0 ) {
    //GETS LATEST POST
    ?>

    <div id=\"latest\" class=\"post\">
    <div class=\"postThumbWrap\">
    <img src=\"<?php echo get_post_meta($post->ID, 'featured-thumb', true); ?>\"/>
    </div>
    <p id=\"featureDate\"><?php the_time('M j') ?></p>
    <h2><?php the_title(); ?></h2>
    <?php if(has_tag('time-sensitive')) {?>
    <?php the_tags('<p class=\"timeSensitiveTag\">','','</p>'); ?>
    <?php } ?>
    <p class=\"first\">This is where the first paragraph from the post will go. Currently hard coded into the WP theme for styling. Needs to extract the the first paragraph from the featured post, and not show it when clicking on more.</p>
    <div class=\"slickBox\">
    <?php the_content(); ?>
    <ul class=\"postFooterLinks\">
    <li class=\"emailThis\"><a href=\"mailto:?subject=Take%20a%20Look&body=<?php echo get_permalink(); ?>\">Email</a></li>
    <li class=\"printThis\"><a href=\"#\" onclick=\"window.open('<?php echo get_permalink(); ?>?print=true','');return false;\">Print</a></li>
    <li class=\"linkThis\"><a href=\"<?php echo get_permalink(); ?>\">Link</a></li>
    <li class=\"callendarThis\"><a href=\"\"></a></li>
    </ul>
    </div><!-- end .slickBox -->
    <p class=\"more\"><a href=\"\" class=\"slick-toggle\">More</a></p>
    </div><!--END LATEST-->

    <?php
    } elseif( $postcount > 0 && $postcount <= 8 ) {
    //GETS MORE EXCERPTS
    ?>
    <div <?php post_class() ?> id=\"headline-<?php echo $postcount; ?>\">
    <div class=\"postHeaderWrap\">
    <div class=\"headlineAndTimeSensWrap\">
    <h2><?php the_title(); ?></h2>
    <?php if(has_tag('time-sensitive')) {?>
    <?php the_tags('<p class=\"timeSensitiveTag\">','','</p>'); ?>
    <?php } ?>
    </div>
    <?php
    //date image replacement prep
    $postMonth=get_the_time('M');
    $postDay=get_the_time('j');
    ?>
    <div class=\"dateWrap\">
    <p class=\"month <?php echo $postMonth; ?>\"><?php echo $postMonth; ?></p>
    <p class=\"day<?php echo $postDay; ?> day\"><?php echo $postDay?></span></p>
    </div>
    </div>
    <div class=\"slickBox\">
    <?php the_content(); ?>
    <ul class=\"postFooterLinks\">
    <li class=\"emailThis\"><a href=\"mailto:?subject=Take%20a%20Look&body=<?php echo get_permalink(); ?>\">Email</a></li>
    <li class=\"printThis\"><a href=\"#\" onclick=\"window.open('<?php echo get_permalink(); ?>?print=true','');return false;\">Print</a></li>
    <li class=\"linkThis\"><a href=\"<?php echo get_permalink(); ?>\">Link</a></li>
    <li class=\"callendarThis\"><a href=\"\"></a></li>
    </ul>
    </div><!-- end .slickBox -->
    <p class=\"more\"><a href=\"\" class=\"slick-toggle\">More</a></p>
    </div>
    <!-- <span class=\"commentcount\">(<?php comments_popup_link('0', '1', '%'); ?>)</span> -->
    <?php
    }
    $postcount ++;
    // close the loop
    }
    }
    ?>

    </div><!-- end #mainContent -->