WordPress:在img标签中回显特色图片

时间:2015-10-20 18:37:20

标签: php wordpress twitter-bootstrap custom-post-type

我正在尝试在页面模板中获取要素图像并将其打印在引导程序代码块中,如此

    <div class="container">
            <?php
                $args=array('post_type' => 'partner');
                $query= new WP_Query($args);                               
                // Start the Loop.
                while ($query-> have_posts() ) : $query->the_post()?>                                    

         <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
           <img src="<?php  echo the_post_thumbnail();?>" class="img-responsive"> 
         </div>
      <?php                                
          endwhile;
       ?>

    </div>                             

这不是打印图片有什么问题请帮忙

2 个答案:

答案 0 :(得分:2)

the_post_thumbnail()已打印缩略图...这意味着您不应将echo与其结合使用。它还会打印整个<img />标签...而不是来源。它的第二个参数是一个属性数组。

正确使用如下所示:

<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
    <?php the_post_thumbnail( 'full', array( 'class' => 'img-responsive' ) ); ?>
</div>

以下是该标记的工作原理:

  

<?php the_post_thumbnail( $size, $attr ); ?>

     

$size - 图片大小(关键字或维度数组)

     

$attr - 属性/值对的数组。

了解更多in the Codex

答案 1 :(得分:0)

在此参考中,您还可以将图片网址放在img标记的href中。所以你的完整代码将是这样的:

<div class="container">
<?php
                $args=array('post_type' => 'partner');
                $query= new WP_Query($args);                               
                // Start the Loop.
                while ($query-> have_posts() ) : $query->the_post()?>                                    

         <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
         <?php if (has_post_thumbnail( $post->ID ) ): ?>
        <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
        <img src="<?php echo $image[0]; ?>" class="img-responsive"> 
        <?php endif; ?>

         </div>
      <?php                                
          endwhile;
       ?>
</div>