Thumbnails
在functions中处理
这个功能让主题支持特色图片(Post Thumbnails),这个功能是 2.9 版本引进的,我们可以将日志类型(Post Type)数组作为第二个参数,来指定哪些日志类型要启用这个功能。
add_theme_support('post-thumbnails');//所有日志类型都支持。
add_theme_support('post-thumbnails',array('post'));// Posts only
add_theme_support('post-thumbnails',array('page'));// Pages only
add_theme_support('post-thumbnails',array('post','movie'));// Posts and Movies
这个功能必须在 init hook 之前调用,所以必须在主题的 functions.php 文件或者在 ‘after_setup_theme’ hook 中调用。
对于自定义日志类型(custom post types),我们可以在使用 register_post_type() 注册新的日志类型的时候,添加 post thumbnails 的支持。
将图像输出为HTML
将图像输出为HTML 也非常容易,使用函数:
get_the_post_thumbnail();
举例
<?php echo get_the_post_thumbnail( $post->ID, 'large' ); ?>
输出:
<img width="640" height="131" src="http://127.0.0.1/wpstrap/wp-content/uploads/2020/07/顶部图像2-980X200.jpg" class="attachment-large size-large wp-post-image" alt="" srcset="http://127.0.0.1/wpstrap/wp-content/uploads/2020/07/顶部图像2-980X200.jpg 980w, http://127.0.0.1/wpstrap/wp-content/uploads/2020/07/顶部图像2-980X200-300x61.jpg 300w, http://127.0.0.1/wpstrap/wp-content/uploads/2020/07/顶部图像2-980X200-768x157.jpg 768w" sizes="(max-width: 640px) 100vw, 640px" />
获取特色图片URL地址
假设您将使用它作为元素上的background-image
而不是内容图像。 不幸的是,没有超级简单/明显的功能。
会有一些比较特别的需求——获取page页面文章特色图片的URL地址,而不是获取特色图片本身。这种情况一般很少,但就是有那么个特殊情况,如:首页要用page页面文章内容中的图片,page页面要调用一个全屏的banner图,这个banner是以元素背景图的形势展示。这时,我们用the_post_thumbnail()函数来调用就不适合了,因为,它会把图片直接显示出来,而不会成为其它元素的背景。
这时,我们需要用到2个wordpress主题函数,wp_get_attachment_image_src()和get_post_thumbnail_id()。
在循环中,您必须执行以下操作:
$thumb_id = get_post_thumbnail_id();
$thumb_url_array = wp_get_attachment_image_src($thumb_id, 'thumbnail-size', true);
$thumb_url = $thumb_url_array[0];
然后$thumb_url
将是该URL。
方法1.使用WordPress函数the_post_thumbnail_url()获取特色图片缩略图URL
获当前文章的特色图片直接URL,也可以获取指定POST_ID的文章特色图片直接URL。
它必须在循环中使用。
在使用之前先检查文章是否添加特色图片,检查函数为has_post_thumbnail()。
最终的代码如下,直接添加到要调用特色图片URl的地方即可:
方法2.使用WordPress函数the_post_thumbnail_url()获取特色图片缩略图URL
一些使用场景1
还有就是有的时候,我们需要设置图片的宽度为100%,高度自动。这样通过 the_post_thumbnail() 这个方法就无法实现了。
好了,看下面的方法:
获取特色图像:小
<?php
$thumbnail_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail');
echo $thumbnail_image_url[0];
?>
获取特色图像:中 –> medium
获取特色图像:大 –>large
获取特色图像:完整 –> full
获取特色图像:指定100X100
<?php
$array_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array(100,100));
echo $array_image_url[0];
?>