关于通过PHP回应WordPress缩略图的问题

I am trying to convert my HTML page to a WordPress Theme and so far i am not doing too bad! but I have a problem on loading a Custom post Type thumbnail and adding the required class and style to it. In my HTML I have an image tag like this:

<img class="img-circle" src="img/welcom.jpg" data-src="holder.js/140x140" alt="140x140" style="width: 140px; height: 140px;"> 

I trird to echo above tag in my custom WP Query by contaminating the src attribute like src="'.the_post_thumbnail().'" as:

echo ' <img class="img-circle" src="'.the_post_thumbnail().'" alt="140x140" style="width: 140px; height: 140px;">';

Now I am getting the image on the page but it is not getting any classes and style and the source code looks like Can you please let me know how to fix this?

Your assumption that the_post_thumbnail() returns the src url is wrong. It returns the whole img element...take a look at the codex

but essentially you need to pass the class,size and alt as arguments to the_post_thumbnail()

$size = array(140,140);
$attr = array(
    'class' => "img-circle",
    'alt'   => "140x140"
);
the_post_thumbnail( $size, $attr );

Try with this code, it will helps you for all the rest of images...

Put this code in your function.php file

if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'custom-post-thumb', 140, 140,true );
}

Now use this in your code:

<?php if ( has_post_thumbnail()) : ?>

 <?php the_post_thumbnail('custom-post-thumb', array('class' => 'img-circle')); ?>

<?php endif; ?>

Thanks