WP缩略图未正确呈现

问题描述：

I'm trying to add a thumbail to a div using the_post_thumbnail() function.

The code I'm using is the following:

<div class="sc-col sc-s12 sc-m3 sc-card sc-card-basic">
    <figure>'.the_post_thumbnail(array('370', '188')).'</figure>
</div>

But when the code is rendered in a browser the code becomes (just took a part of the rendered code):

<img width="370" height="182" src="/wp-content/uploads/2016/05/image.png">
<div class="sc-col sc-s12 sc-m3 sc-card sc-card-basic">
    <figure></figure>
</div>

As you can see the image is rendered outside the div and figure. My question is why is it doing this? Because now my whole layout is breaking now and, the problem is that I have to use that function else I would have used an other function. Can I somehow rewrite the function so it only returns the src link using add_filter function?

我正在尝试使用the_post_thumbnail（） code>函数向div添加一个缩略图。 p>

我正在使用的代码如下： p>


 ＆lt; div class =“sc-col sc-s12 sc-m3  sc-card sc-card-basic“＆gt; 
＆lt; figure＆gt;'。the_post_thumbnail（array（'370'，'188'））。'＆lt; / figure＆gt; 
＆lt; / div＆gt; 
  code  >  pre> 
 
 但是当代码在浏览器中呈现时，代码变为（只占用了渲染代码的一部分 em>）： p> 
 
  
 ＆lt; img width =“370”height =“182”src =“/ wp-content / uploads / 2016/05 / image.png”＆gt; 
＆lt; div class =“sc-col sc  -s12 sc-m3 sc-card sc-card-basic“＆gt; 
＆lt; figure＆gt;＆lt; / figure＆gt; 
＆lt; / div＆gt; 
  code>  pre> 
 
  如您所见，图像在 div  code>和 figure  code>之外呈现。 我的问题是为什么这样做？ 因为现在我的整个布局现在正在破坏，问题是我必须使用该功能，否则我将使用其他功能。 我可以以某种方式重写函数，以便它只使用 add_filter  code>函数返回src链接吗？ p> 
  div>

答

This solved it for me:

<figure><?php the_post_thumbnail(array('370', '188')); ?></figure>

As staded by @ChrisLear the_post_thumbail() doens't return a string and there for fails.

答

https://developer.wordpress.org/reference/functions/the_post_thumbnail/ shows that the function the_post_thumbnail is designed to actually output something to the page, not return a string.

So change your code to something more like this:

$html = '<div class="sc-col sc-s12 sc-m3 sc-card sc-card-basic">
    <figure>';
echo $html;
the_post_thumbnail(array('370', '188'))
$html = '</figure>
</div>';
echo $html;

WP缩略图未正确呈现

相关推荐