正如我在评论中所说,如果您指的是$page[0]
变量,那么您可以使用get_the_post_thumbnail()
like so:(注意,我检查了$page[0]
在尝试使用之前设置)
// The HTML/formatting is entirely up to you..
if ( ! empty( $page ) && isset( $page[0] ) ) {
echo get_the_post_thumbnail( $page[0] );
echo \'<hr>\' . $page[0]->post_content;
}
有关使用该功能的更多详细信息,请查看文档,但对于更改或使用不同的缩略图大小(默认大小命名为
post-thumbnail
), 只需将第二个参数设置为注册图像大小的名称,例如。
medium
或
a-custom-size
. 例如。
echo get_the_post_thumbnail( $page[0], \'medium\' );
请注意,特色图片或帖子缩略图有自己的帖子类型
attachment
, 因此,如果要获取帖子缩略图或附件帖子的ID,可以使用
get_post_thumbnail_id()
:
$thumb_post_id = get_post_thumbnail_id( $page[0] ); // get the post ID
$thumb_post = get_post( $thumb_post_id ); // get the full post data
// For debugging purposes:
var_dump( $thumb_post_id, $thumb_post );
所以实际上,一旦你有了post数据(例如
$page[0]
和
$thumb_post
然后,您可以轻松获取该帖子的所有其他数据,如特色图片(如果有/适用)、标题、日期、自定义字段、类别等
var_dump( $page[0] );
然后您会看到各种post数据,但是,对于自定义字段和post对象中不直接可用的其他数据,您可以在单独的问题中提问。:)
其他注释
get_the_post_thumbnail()
使用
wp_get_attachment_image()
这增加了
srcset
和
sizes
用于使图像响应的属性(以便浏览器可以根据用户的设备选择要加载的正确图像)-请参阅
Resolution switching: Different sizes 在MDN Web Docs网站上。
因此,在回答您的意见时:“请echo get_the_post_thumbnail( $page[0],\'medium\' );
不工作;,它可能确实在工作,但浏览器根据上述属性相应地选择了不同的图像。
比如我的情况,echo get_the_post_thumbnail( $page[0], \'medium\' )
是否输出了正确的图像URL(成为图像的src
属性)的medium
尺寸(300px宽):
<!-- I wrapped the srcset value for brevity -->
<img width="300" height="205"
src="https://example.com/wp-content/uploads/2021/12/sample-image-300x205.jpg"
...
srcset="https://example.com/wp-content/uploads/2021/12/sample-image-300x205.jpg 300w,
https://example.com/wp-content/uploads/2021/12/sample-image-1024x701.jpg 1024w,
https://example.com/wp-content/uploads/2021/12/sample-image-768x526.jpg 768w,
https://example.com/wp-content/uploads/2021/12/sample-image-1536x1051.jpg 1536w,
https://example.com/wp-content/uploads/2021/12/sample-image.jpg 1920w"
sizes="(max-width: 300px) 100vw, 300px" />
但我的浏览器的视口宽度是360px,因此浏览器从
srcset
属性-如果那里还有一个600px的图像,那么该图像将被用来代替768px。
不想要srcset
和sizes
属性
嗯,这不是一个好主意,MDN Web文档还说,“我不知道。”
使用此技术可以为移动用户节省大量带宽;,因此,我建议您继续使用该技术,即这两个属性。但是,为了让您知道,您可以使用wp_get_attachment_image_src()
手动生成<img>
标记,这样您就可以完全控制HTML。例如。
$id = get_post_thumbnail_id( $page[0] );
$data = wp_get_attachment_image_src( $id, \'medium\' );
if ( $data ) {
echo \'<img src="\' . esc_url( $data[0] ) . \'" width="\' . $data[1] . \'" height="\' . $data[2] . \'" alt="">\';
}
还有get_the_post_thumbnail_url()
如果您只想获取URL。例如。$url = get_the_post_thumbnail_url( $page[0], \'medium\' );
echo \'<img src="\' . esc_url( $url ) . \'" alt="">\';