Question

我创建了按类别ID获取帖子缩略图的功能。这是代码：

<div class="row text-center">
    <?php
        foreach ( $wp_query->posts as $single_post) 
        {
            $single_post_ID = $single_post->ID;
            $url = wp_get_attachment_url( get_post_thumbnail_id($single_post_ID, 'medium') );
    ?>
    <div class="col-md-3 col-sm-6 hero-feature">
        <div class="thumbnail">
         <img src="<?php echo $url ?>" />
            <div class="caption">
                <h2><?php echo get_the_title( $single_post_ID ); ?></h2>
                <p>
                <a href="#" class="btn btn-primary">Commander</a> 
                <a href="#" class="btn btn-default">Plus Info</a>
                </p>
            </div>
        </div>
    </div>
    <?php } ?>
</div>

我想用wordpress功能将拇指的大小设置为800px×500px 感谢

Answer 1

从我看到的，你的WordPress功能输出你的图像.thumbnail。所以做点什么

 .thumbnail {
 width: 800px;
 height: 500px;
 overflow: hidden; /* Cuts off whatever goes beyond the given width */
}


 .thumbnail img {
  width: 100%; /* 100% equals 800px as defined for .thumbnail */
  height: auto; /* Allows the image a breathing option so it doesn't deteriorate */
}

注意：包含元素已经具有给定宽度（800px），因此图像不会超过800px

Answer 2

在functions.php中使用add_image_size：Wordpress documentation。

add_image_size('my-thumbnail', 800, 500, true);

或使用插件创建更多图片大小，如this。

然后将媒体格式更改为新格式。然后将更大的图像设置为更小的CSS（性能问题）会更好。在此之后，总是取决于您的网站是否响应使用更大的图像，但这是另一个主题。

$url = wp_get_attachment_url( get_post_thumbnail_id($single_post_ID, 'my-thumbnail') );

更新：图片必须重新上传或使用此插件：Resize Image After Upload

设置WordPress缩略图帖子的大小

2 个答案: