WordPress.org

Ready to get started?Download WordPress

Forums

Posts in Page
[resolved] [closed] How to add featured image (27 posts)

  1. jamesxchance
    Member
    Posted 1 year ago #

    Need help with adding featured images to the excerpts. Please help!
    email [ redacted ]

    http://wordpress.org/extend/plugins/posts-in-page/

  2. Peter94
    Member
    Posted 1 year ago #

    Hi from France!

    A correct excerpt with img sourcing works with WP 3.4.2.
    Please See fleurons.fr/best-of/ (WP 342)

    With WP 3.5 too, but Related posts are include without linking. There are two bugs! Related post are not need at this place.
    just1clic.fr/arrivages/

    We have to try to find an automatic excerpt pluging for mass publishing and/or make a correction with WP 3.5 use.

    Have a nice day!

  3. jaybirdf
    Member
    Posted 1 year ago #

    Yes I have Wp 3.5 and would love for the featured images to show.

    Thanks, Great plug-in!

  4. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    Hey Guys,

    Give me a few minutes and I'll throw together some code for you. / Eric

  5. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    Alright guys, here's how you can add the Featured Image to your Posts in Page template.

    As you've already discovered, by default, we're just showing the_title, the_excerpt, categories, tags, and the comment link.

    If you wish to change the output to include the permalink, the first thing I'd recommend is changing the output template. Best way to do this is documented on the plugin site:

    How do I change the output template
    Simply copy the posts_loop_template.php to your theme directory and make changes as necessary.

    You can even rename it - but make sure to indicate that in the shortcode using the template='template_name.php'.

    So, I'd start by copying the posts_loop_template.php to your theme directory.

    Then, open it up in an editor and you'll probably see something like this:

    <!-- Note: if you make changes to this file, move it to your current theme's
    	directory so this file won't be overwritten when the plugin is upgraded. -->
    
    <!-- Start of Post Wrap -->
    <div class="post hentry ivycat-post">
    	<!-- This is the output of the post title -->
    	<h2 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    
    	<!-- This is the output of the excerpt -->
    	<div class="entry-summary">
    		<?php the_excerpt(); ?>
    	</div>
    
    	<!-- This is the output of the meta information -->
    	<div class="entry-utility">
    		<?php if ( count( get_the_category() ) ) : ?>
    			<span class="cat-links">
    				<?php printf( __( '<span class="%1$s">Posted in</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-cat-links', get_the_category_list( ', ' ) ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<?php
    			$tags_list = get_the_tag_list( '', ', ' );
    			if ( $tags_list ):
    		?>
    			<span class="tag-links">
    				<?php printf( __( '<span class="%1$s">Tagged</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<span class="comments-link"><?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?></span>
    		<?php edit_post_link( __( 'Edit', 'twentyten' ), '<span class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
    	</div>
    </div>
    <!-- // End of Post Wrap -->

    To add the featured image, you can use the_post_thumbnail function:

    <?php the_post_thumbnail( $size, $attr ); ?>

    So, in a case where you wanted to add the thumbnail sized image as a featured image to your loop, you'll need to add that function in the template file where you'd like it to appear.

    Here's an example:

    <!-- Note: if you make changes to this file, move it to your current theme's
    	directory so this file won't be overwritten when the plugin is upgraded. -->
    
    <!-- Start of Post Wrap -->
    <div class="post hentry ivycat-post">
    	<!-- This is the output of the post title -->
    	<h2 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    
    	<!-- This is the output of the excerpt -->
    	<div class="entry-summary">
    		<?php the_excerpt(); ?>
    	</div>
    
    	<!-- This will output of the featured image thumbnail  -->
    	<div class="featured-image">
    		<?php the_post_thumbnail( 'thumbnail' ); ?>
    	</div>
    
    	<!-- This is the output of the meta information -->
    	<div class="entry-utility">
    		<?php if ( count( get_the_category() ) ) : ?>
    			<span class="cat-links">
    				<?php printf( __( '<span class="%1$s">Posted in</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-cat-links', get_the_category_list( ', ' ) ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<?php
    			$tags_list = get_the_tag_list( '', ', ' );
    			if ( $tags_list ):
    		?>
    			<span class="tag-links">
    				<?php printf( __( '<span class="%1$s">Tagged</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<span class="comments-link"><?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?></span>
    		<?php edit_post_link( __( 'Edit', 'twentyten' ), '<span class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
    	</div>
    </div>
    <!-- // End of Post Wrap -->

    I hope that helps.

    Eric

  6. cmascarelli
    Member
    Posted 1 year ago #

    I can't find the posts_loop_template.php. Where is it?

    Many thanks.
    c

  7. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    cmascarelli,

    It's in the plugin's directory. If you wish to customize it, move it to your theme's directory first.

    e

  8. Alin Ionut
    Member
    Posted 1 year ago #

    How to wrapp <?php the_excerpt(); ?> text around <?php the_post_thumbnail( 'hotleft' ); ?> ?

  9. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    Hey C3dRy2K,

    How to wrapp <?php the_excerpt(); ?> text around <?php the_post_thumbnail( 'hotleft' ); ?> ?

    Sounds like you're asking a style question; am I right?

    If so, can you provide a link or screenshot?

    If style's the issue, I'm imagining you'll probably use CSS floats to have text 'flow' around an image.

    Hope that helps.
    Eric

  10. Alin Ionut
    Member
    Posted 1 year ago #

    Thank you Eric, i already solved the issue. Now, i need one last thing, to display a custom text if there is no post to display by specific tag and/or category.

  11. jodzeee
    Member
    Posted 1 year ago #

    I copied the file to my themes directory and replaced all with the code provided above. I'm still not seeing the featured image with my post excerpts like I would with a blog page. Did I miss a step?

  12. jodzeee
    Member
    Posted 1 year ago #

    I figured out the step I missed ... I needed to change "twentyten" to my theme's name! Some additional customizations I used in case it helps anyone:

    This was added to functions.php in order to make the image link to the post:

    /** Link all post thumbnails to post permalink  */</p>
    <p>add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );</p>
    <p>function my_post_image_html( $html, $post_id, $post_image_id ) {<br />
      $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';<br />
      return $html;</p>
    <p>}

    Also, this is what I came up with for aligning the image to the left of the excerpt (I put its DIV inside the other DIV) and making it a custom size:

    <!-- This is the output of the excerpt --><br />
    	<div class="entry-summary"><br />
    	<!-- This will output of the featured image thumbnail  --><br />
    		<div class="featured-image"><br />
    			<?php the_post_thumbnail( array(180,9999), array('class' => 'alignleft')); ?><br />
    		</div><br />
    		<?php the_excerpt(); ?><br />
    	</div><br />
  13. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    jodzeee: Glad you got this sorted out. Let us know if you have questions.

    i need one last thing, to display a custom text if there is no post to display by specific tag and/or category.

    C3dRy2K: I'd do this inside your category or tag template, most likely. As with many things, there are several ways you could approach this, but I'd opt for the easy route and just have a fallback within the appropriate template file.

    Make sense?

  14. caitlinstangelo
    Member
    Posted 1 year ago #

    Hello!

    A little stumped about how to copy the posts_loop_template into my theme files. Just copy into my stylesheet? At any particular location? I tried and it doesn't seem to work, so I assume I'm incorrect.

    I'm a newbie, so a basic breakdown would be ideal. I tried researching this myself but I'm coming up empty...and more confused!

    Thanks so much for your time, loving the plugin & active support area!

    Caitlin

  15. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 1 year ago #

    Hey caitlinstangelo,

    Okay, so two things:

    1. In the future, if you wouldn't mind starting a new support thread, it's helpful because we don't mix topics and I can make sure that unaddressed questions are answered.

    Some of these older support posts are marked as resolved and don't automatically move to unresolved when new posts are added.

    2. Onto your question . . .

    A little stumped about how to copy the posts_loop_template into my theme files. Just copy into my stylesheet? At any particular location? I tried and it doesn't seem to work, so I assume I'm incorrect.

    I'm a newbie, so a basic breakdown would be ideal. I tried researching this myself but I'm coming up empty...and more confused!

    So this plugin is really geared a bit more for folks with some CSS, HTML and (if needed) PHP skills. Don't need much, but it helps.

    That said, here's what you do:

    1. Using your file manager, or FTP, copy the posts_loop_template.php file from the post-in-page plugin directory over to your theme's main directory. Not sure what your whole path will be, but you'll be looking for something like /wp-content/plugins/posts-in-page/posts-loop-template.php and will copy it to /wp-content/themes/your-theme-name/
    2. Once you've done that, open the file that you've just copied to your theme directory and change as you see fit.
    3. Save your file and test.
    4. If you need multiple custom Posts in Page templates, you can even rename the posts_loop_template.php file and call it inside the shortcode by name using template='template_name.php'

    Thanks so much for your time, loving the plugin & active support area!

    My pleasure. Glad it's helping you. :)

  16. Alin Ionut
    Member
    Posted 11 months ago #

    i use this code, and i want to retrive a specific text if there's nothing to display.

    <!-- NOTE: If you need to make changes to this file, copy it to your current theme's main
    	directory so your changes won't be overwritten when the plugin is upgraded. -->
    
    <!-- Start of Post Wrap -->
    <div class="post hentry ivycat-post">
        <!-- This will output of the featured image thumbnail  -->
    		<a href="<?php the_permalink() ?>" rel="bookmark">
      <?php if(get_option('thumbok')!="yes"):?>
           <img src="<?php bloginfo('template_directory'); ?>/includes/timthumb.php?src=<?php echo get_post_meta($post->ID, 'image',true) ?>&w=100&h=68&zc=1" class="thepart1bimg"/>
    <?php endif?>
      <?php if(get_option('thumbok')!="no"):?>
      <span class="thepart1bimg"><?php the_post_thumbnail( 'archiveimg' ); ?></span>
      <?php endif?>
           </a>
    	<div class="ptitle"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
    	<!-- This is the output of the EXCERPT -->
    	<div class="entry-summary">
    		<?php the_excerpt(); ?>
    	</div>
        <div class="meta_author">Pe  <?php the_time('j M Y'); ?> | Cu <a href="#comments"> <?php comments_number('0 Comentarii','1 Comentariu','2 Comentarii'); ?> </a>  	  </div>
        <br style="clear: both;" />
    </div>
    <!-- // End of Post Wrap -->

    Something combine with this:

    <?php else : ?>
     <h2 class="center">Not Found</h2>
     <p class="center">
    <?php _e("Sorry, but you are looking for something that isn't here."); ?></p>
  17. lmenara
    Member
    Posted 9 months ago #

    So I managed to add the featured image thumbnails to excerpts (yay!) but I'm not quite sure where to add in the permalink so the images link to their respective posts. Can you show me an example? Here's what I have:

    <div class="post hentry ivycat-post">
    
    	<!-- This is the output of the post TITLE -->
    	<h2 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    
    	<!-- This is the output of the excerpt -->
    	<div class="entry-summary">
    	<!-- This will output of the featured image thumbnail  -->
    		<div class="featured-image">
    			<?php the_post_thumbnail( array(180,9999), array('class' => 'alignleft')); ?>
    
    		</div>
    		<?php the_excerpt(); ?>
    	</div>
    
    	<!-- This is the output of the META information -->
    	<div class="entry-utility">
    		<?php if ( count( get_the_category() ) ) : ?>
    			<span class="cat-links">
    				<?php printf( __( '<span class="%1$s">Posted in</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-cat-links', get_the_category_list( ', ' ) ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<?php
    			$tags_list = get_the_tag_list( '', ', ' );
    			if ( $tags_list ):
    		?>
    			<span class="tag-links">
    				<?php printf( __( '<span class="%1$s">Tagged</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list ); ?>
    			</span>
    			<!--<span class="meta-sep">|</span> -->
    		<?php endif; ?>
    		<!--<span class="comments-link"><?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?></span>-->
    		<?php edit_post_link( __( 'Edit', 'twentyten' ), '<span class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
    	</div>
    </div>
  18. jodzeee
    Member
    Posted 9 months ago #

    Imenara: Try adding this to functions.php

    /** Link all post thumbnails to post permalink  */
    
    add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );
    
    function my_post_image_html( $html, $post_id, $post_image_id ) {
    
      $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';
      return $html;
  19. lmenara
    Member
    Posted 9 months ago #

    :S I added it and updated the file; the screen went blank and now wordpress admin and my site are not working. I tried to hit the back button on the browser and delete the code I added, clicked update and it's still blank. What just happened?

  20. jodzeee
    Member
    Posted 9 months ago #

    Oh no, sorry. I think I missed the last closing bracket at the end. Should have been:

    /** Link all post thumbnails to post permalink  */
    
    add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );
    
    function my_post_image_html( $html, $post_id, $post_image_id ) {
    
      $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';
      return $html;
    
    }

    I normally work on my local server and make changes to functions.php and stylesheet.css in a text editor so if something goes wrong, I can easily go back and fix it.

    Can you access functions.php through a file manager via your host or FTP? If you can, add that last bracket and refresh.

  21. lmenara
    Member
    Posted 9 months ago #

    Ok back in business, but every time I add the code in it breaks the site again, bracket or no bracket. Does it make a difference that this is in my functions.php right now?

    // Replaces the excerpt "more" text by a link
    function new_excerpt_more($more) {
           global $post;
    	return '<a class="moretag" href="'. get_permalink($post->ID) . '"> Read more...</a>';
    }
    add_filter('excerpt_more', 'new_excerpt_more');
    
    function woo_display_post_image() {
    global $woo_options;
    $display_image = false;
    $width = $woo_options['woo_thumb_w'];
    $height = $woo_options['woo_thumb_h'];
    $align = $woo_options['woo_thumb_align'];
    if ( (is_single() || is_page()) && @$woo_options['woo_thumb_single'] == 'true' ) {
    $width = $woo_options['woo_single_w'];
    $height = $woo_options['woo_single_h'];
    $align = $woo_options['woo_thumb_align_single'];
    $display_image = true;
    }
    if ( get_option('woo_woo_tumblog_switch') == 'true' ) { $is_tumblog = woo_tumblog_test(); } else { $is_tumblog = false; }
    if ( $is_tumblog || ( is_single() && @$woo_options['woo_thumb_single'] == 'false' ) ) { $display_image = false; }
    if ( $display_image == true and !woo_embed('') ) { woo_image('width=' . $width . '&height=' . $height . '&class=thumbnail ' . $align); }
    } // End woo_display_post_image()
  22. jodzeee
    Member
    Posted 9 months ago #

    Sorry ... I'm not much help. I don't remember what I did and why. If I get a chance, I'll try to dissect mine and see if I can figure it out. In the meantime, someone with more experience might have an answer for you!

  23. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 9 months ago #

    Hey lmenara,

    So, I think it's a lot easier than you may think. Try wrapping your featured image in:

    <a href="<?php the_permalink(); ?>"> here is where your featured image goes </a>

    Using your entire example above, I'd change it to:

    <div class="post hentry ivycat-post">
    
    	<!-- This is the output of the post TITLE -->
    	<h2 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    
    	<!-- This is the output of the excerpt -->
    	<div class="entry-summary">
    	<!-- This will output of the featured image thumbnail  -->
    		<div class="featured-image">
    			<a href="<?php the_permalink(); ?>">
    				<?php the_post_thumbnail( array(180,9999), array('class' => 'alignleft')); ?>
    			</a>
    		</div>
    		<?php the_excerpt(); ?>
    	</div>
    
    	<!-- This is the output of the META information -->
    	<div class="entry-utility">
    		<?php if ( count( get_the_category() ) ) : ?>
    			<span class="cat-links">
    				<?php printf( __( '<span class="%1$s">Posted in</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-cat-links', get_the_category_list( ', ' ) ); ?>
    			</span>
    			<span class="meta-sep">|</span>
    		<?php endif; ?>
    		<?php
    			$tags_list = get_the_tag_list( '', ', ' );
    			if ( $tags_list ):
    		?>
    			<span class="tag-links">
    				<?php printf( __( '<span class="%1$s">Tagged</span> %2$s', 'twentyten' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list ); ?>
    			</span>
    			<!--<span class="meta-sep">|</span> -->
    		<?php endif; ?>
    		<!--<span class="comments-link"><?php comments_popup_link( __( 'Leave a comment', 'twentyten' ), __( '1 Comment', 'twentyten' ), __( '% Comments', 'twentyten' ) ); ?></span>-->
    		<?php edit_post_link( __( 'Edit', 'twentyten' ), '<span class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
    	</div>
    
    </div>
  24. lmenara
    Member
    Posted 9 months ago #

    That's exactly what I was looking for. Worked perfectly! Thank you!

  25. Eric Amundson
    Volunteer Moderator
    Plugin Author

    Posted 9 months ago #

    Bingo! You're welcome. :)

  26. mkozlow
    Member
    Posted 8 months ago #

    what do you charge to fix my site? I have no skill at messing with the back of the system.

  27. That's not something that's discussed here on these forums. Please consider contacting the plugin author on his own site or even post on http://jobs.wordpress.net/

    Per forum rules I am now closing this post.

    http://codex.wordpress.org/Forum_Welcome#Offering_to_Pay

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic