在文章和页面中插入图片（区块编辑器）

返回区块列表

注意：此页面使用区块编辑器。如果您是经典编辑器用户，请参考此页面。

在创建或编辑WordPress页面或博客文章时，您可以使用图片区块轻松地向文章或页面添加图片。

向页面或文章添加图片区块

要将图片添加到您的页面或文章，您需要添加一个图片区块。

您也可以从内容内部添加图片区块。为此，将鼠标悬停在您希望在上方或下方添加图片区块的区块上，然后单击加号。然后从显示的可用区块中选择图片区块。

有关添加区块的详细说明，请参阅此处。

添加区块后，您将看到上传图片、从媒体库选择图片或从URL插入图片的选项。

将图片添加到区块

您可以通过四种方式将图片添加到区块。其中三种通过图片区块占位符上的按钮提供，另一种是拖放方式将图片添加到您的文章或页面。

1. 从您的计算机上传
   点击“上传”按钮。这将打开一个指向您自己硬盘的对话框。选择您要上传的文件，然后点击“打开”按钮。

2. 从媒体库
   您可以通过点击“媒体库”按钮，从媒体库中选择一张现有图片。

3. 从URL插入
   点击“从URL插入”按钮，然后粘贴或输入图片的URL。
   注意事项
   1. URL需要是完整的URL，以https://和域名开头，而不是指向您自己网站的相对引用。
   2. 通过URL插入的图片不会保存到您的媒体库中。它们会继续引用来自该URL网站的图片。如果该网站消失，您的图片也会从您的文章或页面中消失。

4. 拖放
   您可以从计算机的资源管理器或Finder窗口中选择一张图片，并将其拖到区块编辑器窗口中，然后将其拖放到区块中。

区块工具栏

除了左侧的“移动器”和“拖放手柄”之外，图片区块的区块工具栏还显示五个按钮

• 区块样式和转换为
• 更改对齐方式
• 替换图片
• 插入链接
• 更多选项

区块样式/转换为

在此下拉菜单中，您会看到图片的两种样式。

“默认”样式会按照图片上传时的样子显示图片。

“圆角”样式提供带有圆角的显示效果

转换为

您可以将图片区块转换为其他五种区块

分组区块、相册区块、封面区块、文件区块和媒体与文本区块。请使用链接了解更多关于这些使用图片的区块。

替换

工具栏上的“替换”按钮为您提供了三种选择来替换现有图片：通过媒体库、从计算机上传或从URL插入。这些是您在本文开头遇到的相同选项。

插入链接

“插入链接”按钮允许您为图片添加链接。链接选项有：

• 粘贴URL – 链接到网站或您自己网站上的不同文章或页面。可以是相对或绝对路径（“/contact-page”或“https://google.com”）。输入关键词，搜索将从您自己网站上找到页面/文章。
• 媒体文件 – 链接到一个仅包含图片的页面
• 附件页面 – 链接到WordPress附件页面，其中包含图片的详细信息

更多选项

图片区块有许多额外选项，可以通过点击工具栏右侧的三点菜单来访问。这些选项对所有区块都是通用的，您可以在此处了解更多信息。

区块设置

当您向文章或页面内容添加新区块时，它会自动在右侧菜单中显示该区块的设置。

样式

图片可以显示两种不同的样式。

“默认”样式会按照图片上传时的样子显示图片。

“圆角”样式提供带有圆角的显示效果

通过默认样式下拉菜单，您可以选择一个默认显示变体。

图片设置

图片设置包括替代文本、图片尺寸、图片尺寸和高级。

替代文本设置用于为无法看到图片的人添加图片描述。这有助于辅助功能和搜索引擎优化。

图片尺寸设置允许您选择缩略图、中、大和完整尺寸。

• 缩略图：在页面/文章上显示您的图片的小缩略图版本。请注意，默认情况下，缩略图尺寸是正方形，因此您的原始图片可能会被裁剪。
• 中等：在页面/文章上显示您的图片的中等大小版本。这是一种适合与左/右对齐一起使用的尺寸，因为它为两侧的清晰文本留出了足够的空间。
• 大尺寸：在页面/文章上显示您图片的大尺寸版本。注意：WordPress将根据您主题的内容列宽度，显示该空间允许的最大图片。
• 完整尺寸：在页面/文章上显示您图片的完整尺寸版本。注意：WordPress将根据您主题的内容列宽度，显示该空间允许的最大图片。如果您的原始图片大于此列宽，则可能无法显示图片的完整尺寸。

图片尺寸设置允许您手动设置高度和宽度，或将图片设置为其完整尺寸的25%、50%、75%或100%。还有一个重置按钮，以防您需要恢复更改。

高级

标题属性

除了替代文本，您还可以为图片添加标题属性，简要描述此图片在页面上的作用。

要了解更多信息，请点击链接查看W3.org（HTML标准机构）的解释。

额外 CSS 类

在“附加CSS类”部分，您可以为一个或多个CSS类添加到您的区块，允许您编写自定义CSS并根据需要设置区块样式。

图片说明文字

在图片区块中的图片下方，您可以选择添加说明文字。您可以将文本格式化为粗体、斜体并添加链接。

延伸阅读

• 嵌入 – 插入不同媒体类型。
• 相册 – 将相册区块插入页面或文章
• 图像大小和质量
• 使用图片
• 使用图片和文件附件
• 设置媒体屏幕
• 媒体库屏幕
• 媒体添加新屏幕
• 编辑媒体
• 在文章和页面中插入图片（经典编辑器）