Home » Php » php – How do pull images from a wordpress post to display it on the screen?

php – How do pull images from a wordpress post to display it on the screen?

Posted by: admin February 25, 2020 Leave a comment

Questions:

I am trying to display something like a thumbnail for my post. Is there any wordpress function that can do that? I read about wordpress featured images but I dont see the option to set one on the wordpress admin page.

I also tried using the_post_thumbnail() but it didnt work.

this is what my div looks like at the moment:

<div class="card" style="width: 22rem;">
          <img src="<?php the_post_thumbnail(); ?>" class="card-img-top" alt="...">
          <div class="card-body">
            <h5 class="card-title"><?php the_title() ?></h5>
            <p class="card-text">Random Card content</p>
          </div>
</div>
How to&Answers:

Just use:

<?php the_post_thumbnail(); ?>

Like below codes:

<div class="card" style="width: 22rem;">
      <?php the_post_thumbnail('post-thumbnail', ['class' => 'card-img-top']);?>

      <div class="card-body">
        <h5 class="card-title"><?php the_title(); ?></h5>
        <p class="card-text">Random Card content</p>
      </div>
</div>

When you use the_post_thumbnail() dont use extra img tag!

Answer:

the_post_thumbnail(); directly output the image.So please don’t use echo

the_post_thumbnail( $size, $attr ); 
the_post_thumbnail( 'thumbnail' );


<div class="card" style="width: 22rem;">
   <?php the_post_thumbnail('thumbnail'); ?>
          <div class="card-body">
            <h5 class="card-title"><?php the_title() ?></h5>
            <p class="card-text">Random Card content</p>
          </div>
</div>

Answer:

I also found another way to do it while using the img tag

<img class="card-img-top" src="<?php the_post_thumbnail_url() ?>" alt="Card image cap">