如何在WordPress中裁剪和调整图像大小?

我们在这个网站上有超过2万张图片。通常,在通过WordPress文章编辑器上传之前,我们使用Snagit等软件进行图像捕获和编辑。但是,有时需要在编辑器中编辑图像。例如,如果您想修剪边缘或放大或更改大小以适应文章布局。您可以使用多种方法在WordPress中裁剪和调整图像大小,我们将在本文中解释一些简单

How-to-resize-images-in-WordPress-1024x576.jpgo_

我们在这个网站上有超过2万张图片。通常,在通过WordPress文章编辑器上传之前,我们使用Snagit等软件进行图像捕获和编辑。

但是,有时需要在编辑器中编辑图像。例如,如果您想修剪边缘或放大或更改大小以适应文章布局。

您可以使用多种方法在WordPress中裁剪和调整图像大小,我们将在本文中解释一些简单的选项。

调整大小表示更改图像的尺寸。但是,有不同的方法可以通过保持纵横比或裁剪不必要的部分来更改尺寸。

  • 按比例更改高度和宽度
  • 通过切掉角落使图像变圆角
  • 放大以聚焦图像的中心部分
  • 更改纵横比或旋转图像以更改其高度和宽度。
  • 缩放到任何特定尺寸或纵横比

我们在WordPress中看不到任何用于批量调整图像大小的选项。但是,有两种方法可以在WordPress中调整单个图像的大小——一种来自Gutenberg文章编辑器,另一种来自媒体库。让我们在以下部分详细解释这两个选项。

在创建或编辑文章时,插入图像区块并上传图像。您可以使用以下选项之一调整大小。

1.1. 使用区块设置

单击上传的图像,然后单击工具栏上显示的三个垂直点图标。选择“显示更多设置”以在右侧栏中查看图像块的设置。如果选项显示“隐藏更多设置”,那么您应该已经在侧边栏中看到了该区块的设置。

Show-Image-Block-Settings-in-Gutenberg.jpgo_

在Gutenberg中显示图像区块设置

您可以使用以下设置来调整所选图像的大小:

  • 样式 – 默认选项将使图像保持原样,而圆角选项会将您的图像转换为圆角。
  • 图像尺寸 – 选择可用于您的主题的注册图像尺寸。您可以选择全尺寸、中等尺寸或缩略图尺寸来显示。请记住,这些选项的尺寸将根据您在“设置 > 媒体”部分下的设置进行考虑。
  • 图像分辨率 – 选择预设选项之一,例如25%、50%、75%(100%是您的图像尺寸)或输入图像的自定义宽度/高度。如果尺寸与布局不匹配,您可以使用新尺寸预览图像并重置。

下面是具有圆形样式和50%调整大小的图像在编辑器中的外观。

Resize-Images-from-Block-Settings-in-Gutenberg.jpgo_

从Gutenberg的区块设置中调整图像大小

1.2.?在古腾堡编辑器中裁剪图像

单击图像时,您会看到弹出的工具栏中出现“裁剪”图标。虽然它说裁剪,但它不允许您像在Photoshop、Snagit或任何其他图像编辑器中那样调整大小或裁剪。它提供以下三个选项:

  • 缩放 – 单击镜头图标以查看滑块以拖动和放大图像。您可以使用此选项将图像放大至300%,以集中显示图像中的任何微小细节。

Zoom-In-Image-in-WordPress.jpgo_

在WordPress中放大图像

  • 纵横比 – 您总共有9种预定义的纵横比可用,横向和纵向各4种,方形尺寸各1种。选择16:9或2:3或您喜欢的任何尺寸来调整图像大小。

Change-Image-Aspect-Ratio-in-WordPress.jpgo_

在WordPress中更改图像纵横比

  • 旋转 – 使用此选项将图像旋转90度以水平或垂直翻转。

Cropped-Image-in-Gutenberg-Editor.jpgo_

古腾堡编辑器中的裁剪图像

尽管您可以使用所有这些选项来调整图像大小,但我们认为放大、旋转或更改纵横比在世界任何地方都不会被称为裁剪。我们不知道为什么WordPress家伙给那个图标起这个误导性的名字并显示网格。许多用户会认为他们可以拖动网格或选择要裁剪的部分。但是,它在Gutenberg编辑器中并不像那样工作。

1.3.?拖动和调整大小

如果您对使用鼠标调整图像大小感到满意,则只需单击图像即可。WordPress将在图像的右侧、左侧和底部显示一个拖动器。按比例拖动图像并将其调整为原始大小。请记住,如果您以这种方式调整大小,纵横比不会改变,这意味着高度和宽度将按比例而不是独立地改变。

Drag-and-Resize-Image-in-WordPress.jpgo_

在WordPress中拖动和调整图像大小

这与WordPress使用旧版经典编辑器的方式相同,您只能按比例调整图像大小。

Resize-Image-in-WordPress-Classic-Editor.jpgo_

在WordPress经典编辑器中调整图像大小

这是一种方便的方法,特别是如果您真的想裁剪图像。转到“媒体 > 库”并选择要编辑的图像。

Edit-Image-in-Media-Library.jpgo_

在媒体库中编辑图像

与Gutenberg图像区块的设置类似,您可以使用侧边栏中的以下选项。

Resize-Image-in-Media-Library.jpgo_

调整媒体库中的图像大小

  • 缩放图像 – 在这里您可以看到原始图像尺寸以及输入新高度/宽度尺寸的选项。输入新尺寸后,单击“缩放”按钮调整图像大小。
  • 缩略图设置 – 选择选项以将更改应用于所选图像的所有尺寸,仅适用于缩略图或除缩略图之外的所有尺寸。

您还有四个选项可以使用图像上方可用的按钮向左/向右旋转和水平/垂直翻转。让我们更详细地解释裁剪选项。

2.1. 在媒体库中裁剪图像

“图像裁剪”选项允许您使用纵横比或选择尺寸进行裁剪。

  • 要裁剪图像,只需使用鼠标在图像上选择要裁剪的部分。尺寸将显示在“选择”部分。
  • 如果要固定纵横比,请先在“纵横比”中输入比例,然后使用鼠标选择该部分。

修复选择后,单击“裁剪”按钮。

Crop-Image-for-Selection-and-Aspect-Ratio.jpgo_

裁剪图像以供选择和纵横比

WordPress 将根据您的选择进行处理并显示裁剪后的图像。单击“保存”按钮应用更改或单击“撤消”按钮恢复为原始大小。

Cropped-Image-in-WordPress-Media-Library.jpgo_

WordPress媒体库中的裁剪图像

如您所见,WordPress中有多个选项可以裁剪和调整图像大小。您可以使用旧的经典编辑器、古腾堡区块编辑器或编辑媒体库中的图像。唯一令人困惑的是古腾堡中的裁剪功能,您可以使用媒体库来实现它。

但小编建议,尽可能在上传图像至WordPress之前,完成图像裁剪和调整工作,比在WordPress上操作要高效得多。

本文内容来源于公开网络,出于传递信息之目的整理发布。原文版权归原作者所有,若涉及侵权请先提供版权后联系我们删除

(0)
WP之家WP之家
上一篇 2025年3月13日 下午5:10
下一篇 2025年3月13日 下午5:11

相关推荐

  • 如何通过Gravatar设置WordPress博客头像

    使用Gravatar创建一个WordPress头像 首先,访问Gravatar官方网站。 进入Gravatar网站后,点击页面的蓝色按钮“”Create Your Own Gravatar””。 页面将跳转到“使用 WordPress.com 帐户注册 Gravatar”,你只需要注册一…

    2025年3月23日
  • 增强WordPress网站安全性(7个步骤为您的WordPress安全防线保驾护航)

    1、安装wordpress安全插件,这里推荐的是All In One WP Security,这个比较鼎鼎有名的号称是全方位最好的 WordPress 安全插件,其实功能还是比较强大,我们可以利用他来提高自身网站的安全性,比如屏蔽恶意ip,比如…

    2025年3月19日
  • 如何使用Amazon SES发送WordPress电子邮件

    提高WordPress电子邮件可靠性的一种简单方法是使用AmazonSimpleEmailService或AmazonSES。在本教程中,我们将逐步向您展示如何使用AmazonSES从您的WordPress站点发送电子邮件。我们经常听到用户无法从他们的WordPress网站发送电子邮件。这是一个问题,因为您依靠电子邮件来保持您的网站顺利运行。例如,您的站点依靠电子邮件来重置丢

    2025年3月13日
  • 如何为WordPress外贸网站添加自动话务员电话系统

    如果您经营的是一个WordPress外贸网站,您可能想为外贸网站设置自动客服电话系统吗?对于企业主而言,自动值班电话系统可以降低成本,帮助您更快接听电话,改善客户服务,并使您的小型企业看起来更专业。在本教程中,我们将分享有关如何为WordPress外贸网站轻松设置自动客服电话系统的具体步骤。对于大多数小型企业网站或在线商店,您只需将电话号码添加到您的网站

    2025年3月13日
  • 如何使用AI搭建WordPress网站

    人工智能正迅速成为包括网页设计在内的许多行业在其功能设置中添加的一种工具。在数字设计和营销领域,许多成熟的工具都在其产品中添加了人工智能功能。WordPress也是如此。作为目前最流行的网站建设工具之一,WordPress的人工智能插件越来越多也就不足为奇了。本指南将向您展示如何将人

    2025年3月13日
  • WordPress手动升级教程

    手动文件更新 1 . 先下载Wordpress最新版解压,得到下面文件。然后把wp-content文件夹删掉,把剩下的文件在FTP上传替换,升级网站文件 2 . 在浏览器上输入地址:域名/wp-admin/upgrade.php升级数据库。 当第一种升…

    2025年3月18日
  • 更新升级WordPress版本时需要注意的事项

    WordPress 网站后台,发现有一个新的 WordPress 版本,直接点击了“立即更新”,然后走出去喝咖啡,回来时发现网站无法加载。 恐慌油然而生。主页一团糟。客户登录失败。支持团队被淹没在主题为“紧急!!”和 “你做了…

    2025年3月13日
  • 最佳WordPress摘录长度及相关插件

    如果您是WordPress用户,您已经知道主题和WordPress核心自动化了许多决定内容显示方式的功能。一个常见的例子是页面如何显示文章的摘要。但是您知道您可以自定义WordPress摘要长度吗?本教程将解释如何做到这一点!WordPress中的摘要是什么?如何更改摘要长度?手动更改WordPress摘要长度使用插件更改WordPress摘要长度摘

    2025年3月13日