WordPress.org

Ready to get started?Download WordPress

Forums

Display posts as thumbs (12 posts)

  1. nlex
    Member
    Posted 5 years ago #

    Hey. I would like to display a list of post with tittle and thumbs. For the tiitle its easy, but i don't know how to do for the Thumbnails part.

    Do i have to write a function or WP can do it directly ? I Would like to avoid plugins for this…

    Any idea ?

  2. mikejandreau
    Member
    Posted 5 years ago #

    You'd need to use custom fields to display thumbnail images. It's pretty easy to do, you just have to go through all your already published posts, and add the custom field.

    http://codex.wordpress.org/Using_Custom_Fields

    That should get you started.

  3. renzuken
    Member
    Posted 5 years ago #

    <?php the_title(); ?>
    <img src="<?php get_post_meta($post->id , "image", true); ?>" alt="<?php the_title(); ?>" />

    something like that

    im not sure

    the image is the custom field

  4. mikejandreau
    Member
    Posted 5 years ago #

    Or, an easier way would be:

    <?php the_title(); ?>
    <img src="http://www.yourdomain.com/wp-content/uploads/<?php get_post_meta($post->id , "image", true); ?>" alt="<?php the_title(); ?>" />

    Then use the built in uploader from your "Write" panel, and just drop in the file name and extension in the custom field.

    Save you the trouble of typing out the whole address every time.

  5. nlex
    Member
    Posted 5 years ago #

    Seems nice, thanks

    OK now, what if i want to display a list of post titles and thumbs of a categorie, using your method ? :)

  6. nlex
    Member
    Posted 5 years ago #

    Any idea ?

    I've tried different things but i'm afraid my PHP abilities are near zero, i wish i could leanr to do that thing my self but i'm not even sure where to start (html ? php ? wordpress tags ? something else )…

  7. SimonJ
    Member
    Posted 5 years ago #

    mikejandreau :... And what will happens if your wordpress uploads are organized by dates ??... The uploaded images aren't always in wp-content/, but by default in wp-content/year/month...

    ---------------------------------

    To display the thumbnail, or any size of the first attachment relative to a post, I don't use a custom field

    I use a function like this one. It looks for the first image relative to a post, uploaded via the write post panel:

    function my_post_thumbnail() {
    global $wpdb;
    global $post;
    $post_thumbnail = $wpdb->get_var("SELECT ID FROM $wpdb->posts where post_parent= $post->ID and post_type = 'attachment'");
    if ($post_thumbnail == 0) {
    echo "";
    }
    else {
    echo wp_get_attachment_image($post_thumbnail, $size='thumbnail', $icon = false);
    }
    }

    This function will output the thumbnail in a html "img src=..." tag if there is an image attached to a the post, but nothing if there is no image...

    Then, just use it as a simple template tag, in your loop wherever you want the thumbnail :

    <?php my_post_thumbnail(); ?>

    To display thumbnails from posts in a specific category, just use query_posts :

    http://codex.wordpress.org/Template_Tags/query_posts

    Something like :

    <?php query_posts('cat=XX'); ?>
    <?php while (have_posts()) : the_post(); ?>
    <?php my_post_thumbnail(); ?>
    <?php endwhile; ?>

    Just adjust cat=XX with the ID of the category you want to display.

    S.

  8. nlex
    Member
    Posted 5 years ago #

    In fact i put my thumbs in a thumbs folder in uploads 'by hand', i don't want something automatic, there. But its interesting anyway…

    Jeez i would like to be able to learn how to do that myself : do you think i need to learn Php ?

  9. nlex
    Member
    Posted 5 years ago #

    Oh and, i found this code before your post, in the french wordpress forum, and it works, i need to compare the method, but i publish it here, for memory.

    <div id="galerie-container">
      <ul id="galerie-liste">
    
    <?php if(have_posts()) : ?>
    <?php while(have_posts()) : the_post(); ?>
    
        <li>
          <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
            <img src="<? $cid = $post->ID; $values = get_post_custom_values('thumb', $cid); echo $values[0]; ?>" alt="<? the_title(); ?>" />
          <strong><?php the_title(); ?></strong><br /><br />
          <span>
            <span class="reference-detail">Valeur1 :</span><?php $values = get_post_custom_values('valeur1', $cid); echo $values[0]; ?><br />
            <span class="reference-detail">Valeur2 :</span><?php $values = get_post_custom_values('valeur2', $cid); echo $values[0]; ?>
          </span>
                  </a>
                </li>
    <?php endwhile; ?>
    <?php endif; ?>
      </ul>
    </div>  <!-- fin "galerie-container" -->
  10. SimonJ
    Member
    Posted 5 years ago #

    Ok, so If you upload manually your thumbs in a thumb folder via ftp, then, go for the custom field solution :

    <?php
    $my_thumb = get_post_meta($post->ID, 'your_thumb_cutsom_field', true);
    if ($my_thumb == '') {
    echo '';
    }
    else {
    echo  '<img src="'.your_thumb_cutsom_field.'" alt="" />';
    }
    ?>

    This code will look if there is a value in the custom field "your-thumb_custom_field". If so, it will outbut the value in a "img src=..." html tag. If no it will output nothing.

    So, in your_custom_field, you enter the name of the image file as a value when you write a post : thumb_image.jpg

    Then, use this code within the loop to display all thumbs from a given category :

    <?php query_posts('cat=XX'); ?>
    <?php while (have_posts()) : the_post(); ?>
    <?php
    $my_thumb = get_post_meta($post->ID, 'your_thumb_cutsom_field', true);
    if ($my_thumb == '') {
    echo '';
    }
    else {
    echo  '<img src="'.your_thumb_cutsom_field.'" alt="" />';
    }
    ?>
    <?php endwhile; ?>

    ---

    If you do it manually, there is another possibility : to name your image/thumbs with the post-slug of the post and then output the slug in an img tag... This way, you don't even need a custom field and it keeps your database light... I use it a lot, tell me so if you're interested in such a function.

    S.

  11. SimonJ
    Member
    Posted 5 years ago #

    Oh... I just realised that I made a mistake in the first code above :

    <?php
    $my_thumb = get_post_meta($post->ID, 'your_thumb_cutsom_field', true);
    if ($my_thumb == '') {
    echo '';
    }
    else {
    echo  '<img src="http://path/to/your/thumb/dir/"'.your_thumb_cutsom_field.'" alt="" />';
    }
    ?>

    You must include your http://path/to/your/thumb/dir/ in the last echo...

    S.

  12. nlex
    Member
    Posted 5 years ago #

    Thanks, gonna try it, looks good

Topic Closed

This topic has been closed to new replies.

About this Topic