WordPress.org

Support

Support » Plugins and Hacks » How to build an image related post plugin

How to build an image related post plugin

  • henri

    @riri23

    Hi all,

    I use the WP 2.3 Related Posts plugin (http://fairyfish.net/2007/09/12/wordpress-23-related-posts-plugin/) in order to display the related post under a post. What I want to do is to display a thumbnail from the related post near its link like in http://www.lifehacker.com/.

    I want to use this piece of code to display the attachment thumb but it doesn’t work…

    <a href="<?php echo wp_get_attachment_url($post->ID); ?>"><?php echo wp_get_attachment_image( $post->ID, 'thumb' ); ?></a>

    I think I must input it in this code (wp 2.3 related posts code) :

    foreach ($related_posts as $related_post ){
    		$output .= '<li>';
    
    		$show_date = get_option("wp23_RP_Date");
    		if ($show_date){
    			$dateformat = get_option('date_format');
    			$output .=   mysql2date($dateformat, $related_post->post_date) . " -- ";
    		}
    
    		$output .=  '<a href="'.get_permalink($related_post->ID).'" title="'.wptexturize($related_post->post_title).'">'.wptexturize($related_post->post_title).'';
    
    		$show_comments_count = get_option("wp23_RP_Comments");
    		if ($show_comments_count){
    			$output .=  " (" . $related_post->comment_count . ")";
    		}
    
    		$output .=  '</a></li>';
    	}
    
    	$output =  '<h3>'.$wp23_RP_title .'</h3>'.'<ul class="related_post">' . $output . '</ul>';
    	return $output;

    If anyone can help me… Thanks

Viewing 15 replies - 1 through 15 (of 15 total)
  • Thad Allender

    @endortrails

    I plug this into functions.php:

    function postimage($size=medium) {
    	if ( $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    	{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    			$imagelink=get_permalink($image->post_parent);
    
    			echo '<a href="'.$imagelink.'">'.$attachmentimage.apply_filters('the_title', $parent->post_title).'</a>';
    		}
    	}
    }

    Then, I query the post thumbnails with this:

    <?php postimage(‘thumbnail’); ?>

    You can use this for the “medium” size image too:

    <?php postimage(‘medium’); ?>

    For original/full

    <?php postimage(‘large’); ?>

    Thanks endortrails

    Please explain more.

    please explain what you need to get explained.

    create a functions.php, insert the code, then upload to your theme directory.
    Use the <?php postimage() ?> code wherever you want to have the post’s image.

    Here is my blog

    http://bbarms.com/blog/speed-loader-airsplat/

    As you can see the “Customers Who Viewed This Item Also Viewed”
    I used the plugin : http://fairyfish.net/2007/09/12/wordpress-23-related-posts-plugin/

    What i need is Post Pictures in front of Similar Post Titles

    Example
    Customers Who Viewed This Item Also Viewed
    (POST PIC) — ( SIMILAR POST TITLE)

    I don’t know this plugin, so I’m “thinking aloud”.
    You still should create that functions.php file and paste the post_image function in there so that you can use the <?php postimage('thumbnail'); ?> code bit.
    Then find the wp_related_posts.php file and open it with a text editor. Make sure to save a copy of the original plugin since we’re editing it 🙂

    Starting in line 114 it seems like the plugin is outputting the actual related posts in an unordered list. So I would change Line 115 from
    $output .= '<li>';
    to
    $output .= '<li>'.postimage('thumbnail');
    and see what happens.

    it look like this
    http://bbarms.com/blog/airsoft-mkii-m249-saw-machine-gun-ak/

    that My Single Post code

    <?php get_header(); ?>
    
    <div id="content"><div id="content-inner">
    
    	<?php get_sidebar(); ?>
    
    	<div id="maincol">
    
    		<div class="col-inner"> 
    
    		  <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    
    		    <div class="post" id="post-<?php the_ID(); ?>">
    
    			  			  <div class="post-title">
    
    			    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
    			  </div>
    
    			 <div class="entry">
    
    <?php the_content(''.__('Read the rest of this entry <span class="meta-nav">&raquo;</span>', 'sandbox').''); ?>
    
    <?php link_pages("\t\t\t\t\t<div class='page-link'>".__('Pages: ', 'sandbox'), "</div>\n", 'number'); ?>
    
    <?php edit_post_link(__('Edit', ''), "- <span class=\"edit-link\">", "</span>"); ?>
    
    			  </div>		
    
    <?php wp_related_posts(); postimage('thumbnail') ; ?>
    
    		  <?php comments_template(); ?>
    
    			<?php endwhile; else: ?>
    
    				<p>Sorry, no posts matched your criteria.</p>
    
    		<?php endif; ?>
    
    		  </div><!-- .post -->
    
    		</div>
    
    	</div><!-- #maincol -->
    
    </div></div><!-- #content -->
    
    <?php include (TEMPLATEPATH . '/extra.php'); ?>
    
    <?php get_footer(); ?>

    See this bit
    <?php wp_related_posts(); postimage('thumbnail') ; ?> just won’t work.
    You can forget your own theme file since you need to put the thumbnail inside the related posts plugin.
    Try the stuff I posted!

    here is my function.php

    <?php
    
    if ( function_exists('register_sidebar') )
    
        register_sidebar(array(
    
    		'name' => 'Left Column',    
    
            'before_widget' => '<li id="%1$s" class="widget %2$s">',
    
            'after_widget' => '</li>',
    
            'before_title' => '<h2 class="sidebartitle">',
    
            'after_title' => '</h2>',
    
        ));
    
    if ( function_exists('register_sidebar') )
    
        register_sidebar(array(
    
    		'name' => 'Right Column',    
    
            'before_widget' => '<li id="%1$s" class="widget %2$s">',
    
            'after_widget' => '</li>',
    
            'before_title' => '<h2 class="sidebartitle">',
    
            'after_title' => '</h2>',
    
        ));
    
    // Search 	
    
    	function widget_zone_out_search() {
    
    ?>	
    
    <?php
    
    }
    
    if ( function_exists('register_sidebar_widget') )
    
        register_sidebar_widget(__('Search'), 'widget_zone_out_search');
    
    function postimage($size=medium) {
    	if ( $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    	{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    			$imagelink=get_permalink($image->post_parent);
    
    			echo '<a href="'.$imagelink.'">'.$attachmentimage.apply_filters('the_title', $parent->post_title).'</a>';
    		}
    	}
    }

    And i also added

    $output .= ‘

  • ‘;
    to
    $output .= ‘
  • ‘.postimage(‘thumbnail’);

    Can u add me harrishcl @ gmail .com / hotmail . com

Single Post (single.php) with <?php postimage(‘thumbnail’); ?>

<?php get_header(); ?>

<div id="content"><div id="content-inner">

	<?php get_sidebar(); ?>

	<div id="maincol">

		<div class="col-inner"> 

		  <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

		    <div class="post" id="post-<?php the_ID(); ?>">

			  			  <div class="post-title">

			    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
			  </div>

			 <div class="entry">

<?php the_content(''.__('Read the rest of this entry <span class="meta-nav">&raquo;</span>', 'sandbox').''); ?>

<?php link_pages("\t\t\t\t\t<div class='page-link'>".__('Pages: ', 'sandbox'), "</div>\n", 'number'); ?>

<?php edit_post_link(__('Edit', ''), "- <span class=\"edit-link\">", "</span>"); ?>

			  </div>		

		<?php wp_related_posts();?>

<?php postimage('thumbnail'); ?> 

		  <?php comments_template(); ?>

			<?php endwhile; else: ?>

				<p>Sorry, no posts matched your criteria.</p>

		<?php endif; ?>

		  </div><!-- .post -->

		</div>

	</div><!-- #maincol -->

</div></div><!-- #content -->

<?php include (TEMPLATEPATH . '/extra.php'); ?>

<?php get_footer(); ?>

First, remove postimage from your theme files. No need to put it anywhere in your theme file. So, remove it from single.php .

Did you put change the output thing in the plugin’s wp_related_posts.php and upload it to the plugin directory? Because I can’t see any hints to that in your site.

ok i remove the postimage from the single.php ,,, and Yes i changed the Ouput thing thru the Plugin editor wp_related_posts.php (i have a backup).

The 10 same images is the result for changing the output.

Okay, sounds like the function does not know what the post-id is.

ANother thing that bothers me is that the images are above the list of related plugins. Something is messed up. try to get rid of the function code inside the plugin, then see if the thumbnails disapear. I’ll get back to you on the ID thing.

function code inside the plugin ?

$output .= ‘# ‘;
to
$output .= ‘# ‘.postimage(‘thumbnail’);

Or Function.php code .

Im looking to a plugin like this, i was thinking using “Extractor” plugin plus “related posts” 2.04

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘How to build an image related post plugin’ is closed to new replies.