如何在 WordPress 中更改特色图片大小

已发表: 2017-04-10
更新于

特色图片在 WordPress 中以多种不同方式使用,具体取决于您使用的主题。 大多数主题使用特色图像作为帖子或页面中图像之一的缩略图预览,通常显示在主页和存档页面上。

此功能是在 WordPress 2.9 中引入的,最初被称为“发布缩略图”。 大多数 WordPress 主题(包括我们自己的)现在都将特色图像用于许多其他目的,例如图像库、功能滑块和页眉图像。 例如,在我们的全帧主题中,特色图片成为帖子的背景图片。

特色图片对于创意人员和任何创建包含大量图片的 WordPress 网站的人来说当然非常重要。 要在任何 Graph Paper Press 主题中使用特色图片,您只需从帖子编辑器屏幕右侧的链接中选择特色图片即可。

如果主题中设置的默认特色图片大小适合您的目的,那就太好了。 如果没有,可以通过一些代码编辑来更改大小。

为什么要更改特色图像大小? 除了使缩略图库更大或更小之外,您可能还需要更改尺寸的纵横比。 例如,假设您是一名风景摄影师,您的作品集由全景照片组成。 在这种情况下,如果主题的默认特色图像是方形的,它最终会裁剪掉大部分图像。 您可以通过手动将尺寸调整为更合适的尺寸来解决此问题。

functions.php中更改特色图像大小

要从默认值编辑特色图像大小,您需要更改functions.php文件中的一些代码。 该文件可以通过 FTP 访问,也可以直接在 WordPress 仪表板的外观 > 编辑器下进行编辑。 我总是会推荐前一种方法而不是后一种方法。

在对此文件进行任何更改之前,始终值得确保您有原始版本的备份,以防出现问题。 如果您的计算机上还没有原始主题文件,请确保至少下载functions.php文件并将其保存到备份文件夹中。

有两种不同的方式来调整特色图像的大小。 要按比例调整大小(即避免拉伸或压缩图像),请使用以下代码:

 set_post_thumbnail_size(50, 50); // 50 像素宽 x 50 像素高,调整大小模式

您还可以选择通过使用以下代码裁剪图像来调整图像大小:

 set_post_thumbnail_size(50, 50, true); // 50 像素宽 x 50 像素高,裁剪模式

这将设置特色图像的默认大小。

添加其他图像尺寸

通过为每个图像尺寸添加额外的代码行,还可以根据需要添加任意数量的其他图像尺寸:

 add_image_size('category-thumb', 300, 9999); // 300 像素宽(无限高)

然后,您可以使用以下代码在主题模板中使用此新尺寸:

 <?php the_post_thumbnail('category-thumb'); ?>

如果您想以多种不同方式显示特色图像,此功能非常方便。 例如,您可能希望为您的图片库设置一个缩略图大小,并为您的帖子标题设置一个更大的大小。

请记住,您上传的图片必须至少与您为特色图片设置的尺寸一样大。 如果您上传较小的图像,它们将被放大并最终看起来像素化和模糊。

重建您的特色图片

更改特色图片大小只会影响代码更改后的上传。 之前上传的所有内容都将保存为原始尺寸,因此您需要重新生成它们。

如果您只有几张图片需要调整大小,您可以手动重新上传。 如果您有很多,最好使用像 Regenerate Thumbnails 这样的插件来为您完成所有艰苦的工作。 可以通过您的工具菜单访问此插件,并将调整您选择的媒体库中的一个或多个图像的大小。

使用儿童主题为您的编辑提供未来证明

直接对您的functions.php文件进行编辑的问题是,如果发布了新版本的主题并且您需要升级它,它们将会丢失。 您可以记下您添加的代码并将其插入到新的functions.php文件中,但这可能会变得乏味,尤其是在您进行大量编辑或主题的新版本经常出现的情况下。

使用子主题解决了这个问题,因为当父主题更新时,子主题保持不变。 如果您正在对主题代码进行任何编辑,无论是在functions.php文件中,还是在样式表或任何其他文件中,使用子主题始终是最佳实践。

我们已经获得了在博客上创建子主题的完整指南,但出于我们的目的,您需要了解以下内容。

要创建子主题,请通过 FTP 连接到您的站点并在/wp-content/themes/中为您的新子主题创建一个新文件夹。 通常将文件夹命名为与您要编辑的主题相同的名称,并在其后附加“-child”。 例如:“awesome-child”,如果您正在制作 Awesome 主题的子主题。

即使您不打算编辑 CSS,也必须在子主题文件夹中创建样式表。 创建一个名为 style.css 的新文件并粘贴以下代码:

 /*
主题名称:真棒孩子
主题 URI:http://example.com/awesome-child/
描述:真棒儿童主题
作者:方格纸出版社
作者 URI:http://example.com
模板:真棒
版本:1.0.0
标签:浅色、深色、响应式布局、可访问性就绪
文本域:awesome-child
*/

@import url("../awesome/style.css");

/* =主题定制从这里开始
-------------------------------------------------- ------------ */

根据需要更改主题名称和其他详细信息。

要添加将特色图像更改为子主题的功能,您需要创建一个新的functions.php文件,因此请继续在子主题目录中执行此操作。 除了父主题的functions.php之外,还将加载此文件。

functions.php的模板如下所示:

 <?php //打开PHP标签

// 职能

?> // 关闭 PHP 标签

然后,您可以在 PHP 标记之间添加图像大小调整代码,因此您最终会得到如下内容:

 <?php // 打开 PHP 标签

如果(函数存在('add_theme_support')){
add_theme_support('后缩略图');
set_post_thumbnail_size(150, 150, 真); // 默认帖子缩略图尺寸(裁剪)

// 额外的图像尺寸
// 如果不需要额外的图像大小,则删除下一行
add_image_size('category-thumb', 300, 9999); //300 像素宽(无限高)
}

?> // 关闭 PHP 标签

完成创建子主题的代码后,您需要激活它。 您可以通过站点仪表板,在Administration Panels > Appearance > Themes下执行此操作。 在列表中找到您的子主题,然后单击激活。

欣赏您调整后的新特色图片

更改特色图像的大小并添加新的图像大小是一项非常简单的任务,但确实需要一些代码编辑。 正因为如此,一些用户更喜欢使用插件来处理图像大小调整,但添加额外的插件总是存在安全风险。 深入了解并像这样对代码进行一些简单的更改可以真正帮助您建立使用 WordPress 的信心,并使您更容易自定义主题并真正使它们成为您自己的主题。