Forums

chanman

http://www.wprecipes.com/how-to-get-the-first-image-from-the-post-and-display-it This is a wordpress problem. I put the code where it said to in my functions and loop files. but all it outputs is the url of the image. here is my site http://www.yardsale.cdcwebdesign.com. And no I am not trying to steal the picture a the top of the page i will pay for it when the site goes live. thanks in advance

chrisburton

@chanman Did you remove anything? Paste the exact code you put inside your loop.

Or you can try this:

   function echo_first_image ($postID)
  {         
    $args = array(
'numberposts' => 1,
'order'=> 'ASC',
'post_mime_type' => 'image',
'post_parent' => $postID,
'post_status' => null,
'post_type' => 'attachment'
);

$attachments = get_children( $args );

//print_r($attachments);

if ($attachments) {
  foreach($attachments as $attachment) {
    $image_attributes = wp_get_attachment_image_src( $attachment->ID, 'thumbnail' )  ? wp_get_attachment_image_src( $attachment->ID, 'thumbnail' ) : wp_get_attachment_image_src( $attachment->ID, 'full' );

    echo '<img src="'.wp_get_attachment_thumb_url( $attachment->ID ).'" class="current">';

  }
}
  }

chanman

This is what is in my entire loop.php file

  <?php if(!is_single()) : global $more; $more = 0; endif; //enable more link ?>

  <?php echo catch_that_image() ?>

  <article id="post-<?php the_ID(); ?>" <?php post_class("post clearfix $class"); ?>>

  <!--<time datetime="<?php the_time('o-m-d') ?>" class="post-date" pubdate><?php the_time('M j, Y') ?></time>-->

  <h1 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>

  <p class="post-meta"> 
  <!--<span class="post-author"><?php the_author_posts_link() ?></span>-->
  <span class="post-category"><?php the_category(', ') ?></span>
  <?php the_tags(' <span class="post-tag">', ', ', '</span>'); ?>
  <?php if ( comments_open() ) : ?>
    <span class="post-comment"><?php comments_popup_link( __( '0 Comment', 'themify' ), __( '1 Comment', 'themify' ), __( '% Comments', 'themify' ) ); ?></span>
  <?php endif; //post comment ?>
</p>

<?php the_content(); ?>

<?php edit_post_link(__('Edit', 'themify'), '[', ']'); ?>




  </article>

  <?php
   if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
  echo '<div class="post-item-divider">Post Divider</div>';
   }
  ?>
  <!-- /.post -->

chanman

Sorry I posted the loop instead of functions I'll post it in the morning.

chanman

This is just the top of the functions.php file

  <?php

  ///////////////////////////////////////
  // You may add your custom functions here
  ///////////////////////////////////////

  function catch_that_image() {
  global $post, $posts;
  $first_img = '';
  ob_start();
  ob_end_clean();
  $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
  $first_img = $matches [1] [0];

   if(empty($first_img)){ //Defines a default image
  $first_img = "/images/default.jpg";
  }
return $first_img;
  }



///////////////////////////////////////
// Load theme languages
///////////////////////////////////////
load_theme_textdomain( 'themify', TEMPLATEPATH.'/languages' );

///////////////////////////////////////
// Enable WordPress feature image
///////////////////////////////////////
add_theme_support( 'post-thumbnails');

///////////////////////////////////////
// Register Custom Menu Function
///////////////////////////////////////
if (function_exists('register_nav_menus')) {
  register_nav_menus( array(
    'main-nav' => __( 'Main Navigation', 'themify' ),
    'footer-nav' => __( 'Footer Navigation', 'themify' ),
  ) );
}

chrisburton

@chanman Remove what you previously used and try the code I provided for you and put it in your theme file.

You also seem to have an error in your functions.php file. I cannot access your site at all.

chanman

I'm trying to do that right now but every time i try to save the file it gives me this

   Parse error: syntax error, unexpected $end in /nfs/c10/h02/mnt/142167/domains/yardsale.cdcwebdesign.com/html/wp-content/themes/base/functions.php on line 199

chrisburton

@chanman Line 199 seems to be fixed now. You have an error on line 3 in loop.php. Perhaps that is <?php catch_that_image(); ?>

If so, remove that.

chanman

I figured out the problem i left out the last } in your code.

chanman

Ok, I got rid of my stuff and put yours and now it's saying this:

  Fatal error: Call to undefined function catch_that_image() in /nfs/c10/h02/mnt/142167/domains/yardsale.cdcwebdesign.com/html/wp-content/themes/base/includes/loop.php on line 3

that probably means I'm still calling my code and not yours right?

chanman

This is whats on line 3

  <?php echo catch_that_image() ?>

chrisburton

@chanman The code I provide you with goes into the theme file (loop.php) not functions.php and you still have an error on line 3 in loop.php.

chrisburton

@chanman Yes. Above I asked you to remove that.

chanman

I thought it went in the functions file let me change it real quick and see what i get.

chrisburton

@chanman Wrap it in php tags <?php THE CODE I PROVIDED GOES HERE ?>

  <?php 
  function echo_first_image ($postID)
  {         
  $args = array(
  'numberposts' => 1,
  'order'=> 'ASC',
  'post_mime_type' => 'image',
  'post_parent' => $postID,
  'post_status' => null,
  'post_type' => 'attachment'
  );

  $attachments = get_children( $args );

  //print_r($attachments);

  if ($attachments) {
    foreach($attachments as $attachment) {
      $image_attributes = wp_get_attachment_image_src(       $attachment->ID, 'thumbnail' )  ?     wp_get_attachment_image_src( $attachment->ID,     'thumbnail' ) : wp_get_attachment_image_src(     $attachment->ID, 'full' );

  echo '<img src="'.wp_get_attachment_thumb_url( $attachment->ID ).'" class="current">';

    }
   }
  }
  ?>

chanman

I figured that out after i saved it.

chrisburton

@chanman Repaste your loop.php file without changing anything.

chanman

It's giving me an error but heres the code

  <?php if(!is_single()) : global $more; $more = 0; endif; //enable more link ?>

  <?php
  function echo_first_image ($postID)
 {         
  $args = array(
  'numberposts' => 1,
  'order'=> 'ASC',
  'post_mime_type' => 'image',
  'post_parent' => $postID,
  'post_status' => null,
  'post_type' => 'attachment'
  );

  $attachments = get_children( $args );

  //print_r($attachments);

     if ($attachments) {
     foreach($attachments as $attachment) {
     $image_attributes = wp_get_attachment_image_src( $attachment->ID, 'thumbnail' )  ? wp_get_attachment_image_src( $attachment->ID, 'thumbnail' ) : wp_get_attachment_image_src( $attachment->ID, 'full' );

   echo '<img src="'.wp_get_attachment_thumb_url( $attachment->ID ).'" class="current">';

    }
  }
    }
  ?>

  <article id="post-<?php the_ID(); ?>" <?php post_class("post clearfix $class"); ?>>



   <h1 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>

    <p class="post-meta"> 
  <!--<span class="post-author"><?php the_author_posts_link() ?></span>-->
  <span class="post-category"><?php the_category(', ') ?></span>
  <?php the_tags(' <span class="post-tag">', ', ', '</span>'); ?>
  <?php if ( comments_open() ) : ?>
    <span class="post-comment"><?php comments_popup_link( __( '0 Comment', 'themify' ), __( '1 Comment', 'themify' ), __( '% Comments', 'themify' ) ); ?></span>
  <?php endif; //post comment ?>
</p>

<?php the_content(); ?>

<?php edit_post_link(__('Edit', 'themify'), '[', ']'); ?>




  </article>

    <?php
    if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
   echo '<div class="post-item-divider">Post Divider</div>';
    }
    ?>
    <!-- /.post -->

chanman

Here is the error it's giving me:

  Fatal error: Cannot redeclare echo_first_image() (previously declared in /nfs/c10/h02/mnt/142167/domains/yardsale.cdcwebdesign.com/html/wp-content/themes/base/includes/loop.php:4) in /nfs/c10/h02/mnt/142167/domains/yardsale.cdcwebdesign.com/html/wp-content/themes/base/includes/loop.php on line 27

chanman

Sorry for all the problems I'm new to wordpress and can't figure it out yet.

chrisburton

@chanman Try this just for kicks.

  <?php 
  if(!function_exists('echo_first_image'))
  {
    function echo_first_image ($postID)
    {         
    $args = array(
    'numberposts' => 1,
    'order'=> 'ASC',
    'post_mime_type' => 'image',
    'post_parent' => $postID,
    'post_status' => null,
    'post_type' => 'attachment'
    );

    $attachments = get_children( $args );

    //print_r($attachments);

    if ($attachments) {
      foreach($attachments as $attachment) {
        $image_attributes = wp_get_attachment_image_src(       $attachment->ID, 'thumbnail' )  ?     wp_get_attachment_image_src( $attachment->ID,       'thumbnail' ) : wp_get_attachment_image_src(     $attachment->ID, 'full' );

    echo '<img src="'.wp_get_attachment_thumb_url( $attachment->ID ).'" class="current">';

      }
     }
    }
  }
    ?>

chanman

it's not working for me and it's not giving an error you go check it out. http://www.yardsale.cdcwebdesign.com

chanman

I don't know if this matters but on the first post the image is in my media library and the second and third post they are called from the mapbox api.

chrisburton

@chanman I might know a fix for your previous code. Repaste your old code into functions.php and loop.php but instead of <?php catch_that_image(); ?>

do this: <img src="<?php catch_that_image(); ?>" />

chanman

didn't work

here is the loop

  <?php if(!is_single()) : global $more; $more = 0; endif; //enable more link ?>

 <img src="<?php catch_that_image(); ?>" />

  <article id="post-<?php the_ID(); ?>" <?php post_class("post clearfix $class"); ?>>



    <h1 class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>

    <p class="post-meta"> 
  <!--<span class="post-author"><?php the_author_posts_link() ?></span>-->
  <span class="post-category"><?php the_category(', ') ?></span>
  <?php the_tags(' <span class="post-tag">', ', ', '</span>'); ?>
  <?php if ( comments_open() ) : ?>
    <span class="post-comment"><?php comments_popup_link( __( '0 Comment', 'themify' ), __( '1 Comment', 'themify' ), __( '% Comments', 'themify' ) ); ?></span>
  <?php endif; //post comment ?>
</p>

   <?php the_content(); ?>

   <?php edit_post_link(__('Edit', 'themify'), '[', ']'); ?>




  </article>

  <?php
  if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
  echo '<div class="post-item-divider">Post Divider</div>';
  }
  ?>
  <!-- /.post -->

here is the fuctions

  <?php

   ///////////////////////////////////////
  // You may add your custom functions here
  ///////////////////////////////////////

  function catch_that_image() {
  global $post, $posts;
  $first_img = '';
  ob_start();
  ob_end_clean();
  $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
  $first_img = $matches [1] [0];

   if(empty($first_img)){ //Defines a default image
  $first_img = "/images/default.jpg";
   }
  return $first_img;
  }




///////////////////////////////////////
// Load theme languages
///////////////////////////////////////
load_theme_textdomain( 'themify', TEMPLATEPATH.'/languages' );

chanman

it's not giving an error either.

chrisburton

@chanman Remove the img tag and just try <?php catch_that_image(); ?> to see if it outputs anything.

chanman

nothing yet.

chrisburton

Then you must have changed something. Are you trying to get the first image of every post?

chanman

yep, i'm not very good at php yet. Do you know of a way you access my code to help me? Is there a way to ad an admin to wordpress or a temp admin?

chanman

Maybe we could open a talk.io and put our email address in it and me send you the files.

chanman

Would it work to add you as a user just while your helping me?

chrisburton

I could do that but not until very late tonight. If I were you, I'd post your problem on stackoverflow.com. I believe you need to use wp_get_attachments to get the first image of every post.

chanman

thanks for all your help i'll try it.

treehouse : what would you like to learn today?

Forums

need help with "How to: Get the first image from the post and display it"