古腾堡编辑器教程:如何使用WordPress图库区块

当您想在 WordPress 网站的文章或页面中插入单个媒体文件时,了解如何使用图片区块就会派上用场。但是,如果您想添加一组照片呢?您可以查看一些 WordPress 流行的相册插件。或者,您也可以使用图库区块。

WordPress 图库区块可以让您方便快捷地在 WordPress 文章和页面中添加多张图片。在本文中,我们将解释什么是图库区块以及它是如何工作的。我们还将提供一些在网站上有效使用它的技巧和最佳实践。

如何在页面或文章中添加图库区块

要在 WordPress 网站上添加图库区块,首先要导航到任何页面或文章(新的或现有的)。然后点击添加区块按钮--加号(+)图标--搜索 "图库":

您可以点击图库块插入图库,或将图标拖放到编辑器中。或者,你也可以直接在编辑器中输入"/gallery",然后按回车键。

插入 "图库" 区块后,你就有了几个添加照片的选项。您可以点击 "上传" 按钮从电脑中选择图片,或者选择 "媒体库" 来选择已经上传到网站上的照片:

无论使用哪种选项,您都可以搜索并选择要使用的所有照片。之后,它们就会出现在区块中:

正如你所看到的,在顶部工具栏中有一个调整图片区块对齐方式的选项,右侧菜单中还有各种设置。让我们仔细看看这些选项分别是什么,以及如何使用它们。

图库区块设置和选项

在图库区块的工具栏中,可以点击对齐图标来更改图库在页面上的位置。默认是左对齐,但也可以将图片区块移到页面的右侧或中间:

您还可以选择 "全幅" 或 "宽幅"--后者会将图库扩展到主题的典型内容部分宽度之外。如果点击三个竖点,你还会发现其他一些选项,包括

  • 复制区块
  • 在当前区块之前或之后插入另一个区块
  • 移动图库区块
  • 以 HTML 格式编辑图片区块
  • 将图库区块添加到可重复使用的区块中

图库区块最有用的一点是,它不仅能让您同时在 WordPress 页面或文章中添加多张照片。您还可以用它按照自己的喜好排列这些图片。例如,您可以自定义图库中包含的列数和图片大小。

您可以在右侧菜单的图库设置部分更改图库列数:

要更改列数,可以使用滑块或在文本字段中输入您想要的值。还可以使用裁剪图像 切换选项:

此设置默认为启用,以便均匀裁剪图像。不过,如果将其关闭,图片将自动以原始版本显示。

在链接到下拉菜单中,可以选择将图库超链接到附件页面或媒体文件。使用图片大小下拉菜单,可以调整照片的大小,选项包括缩略图、中尺寸、大尺寸或全尺寸。

最后,点击图库中的单张图片还可以找到更多选项:

如果要编辑单张照片,只需点击铅笔图标即可。你可以选择 X 图标,将其从图库区块中完全删除。要在照片列表中向前或向后移动照片,可以使用箭头按钮。

有效使用图库区块的技巧和最佳实践

现在我们已经介绍了图库区块的基础知识,您已经准备好学习如何有效地使用它了。要充分利用 WordPress 的这一功能,您可以牢记一些最佳做法。

首先,我们建议您在插入图库区块后,确保裁剪图片功能已打开。当您有各种尺寸和形状的图片时,这个选项会特别有用,因为默认情况下,这些图片有时会显得杂乱无章。

启用该功能后,可以确保图库中的所有图片看起来一致。这有助于使图库看起来更专业、更有条理、更美观。

其次,确保上传到 WordPress 图库的每张图片都经过适当优化也很重要。这包括:

  • 选择有利于搜索引擎优化的文件名
  • 添加备选文本("alt文本")
  • 确保每张图片都经过压缩

使用 WordPress 图片优化插件可以自动完成这一过程,并提高网站性能。它还能提高您的搜索引擎排名。

最后,您可以考虑为图库中的每张图片添加标题。这有助于在游客浏览时为他们提供必要的背景信息。

关于图库区块的常见问题

至此,您应该已经牢牢掌握了图库区块及其使用方法。为了确保涵盖所有基础知识,让我们来看看有关该元素的一些常见问题。

如何在 WordPress 中找到图库区块?

要找到图库区块,请导航到任何文章或页面。然后点击加号(+)图标,在搜索栏中输入 "图库"。只需点击 "图库" 选项,或将其拖放到编辑器中即可插入区块。或者,你也可以直接在编辑器中输入"/gallery",然后点击键盘上的回车键,找到图库区块。

图库区块有什么作用?

图库区块可让您在同一位置为文章添加多张照片。您可以直接在 WordPress 区块编辑器中以美观的方式轻松调整照片的大小和排列方式。例如,您可以决定要使用的列数并调整图片大小。

我可以在 WordPress 的任何地方添加图库区块吗?

您可以在 WordPress 网站的任何页面或文章中添加图库区块。此外,您还可以使用 WordPress 小工具在网站的其他区域(如页脚)添加图库区块。

小结

在 WordPress 文章或页面中插入图片的过程非常简单。不过,有时您可能想将多张照片组合在一起并一次性添加。在这种情况下,您可以利用图库区块。

正如我们在这篇文章中讨论的那样,你可以轻松地将这个区块插入到你的文章和页面中(以及通过部件插入侧边栏和页脚区域),毫不费力地一次上传和排列多张图片。这个区块可以让你根据自己的喜好无缝地调整照片的大小和组织照片。您无需退出编辑器或使用WordPress 图库插件,就可以用它来增强页面的整体外观和感觉。

相关推荐
向宇it15 小时前
【unity小技巧】在 Unity 中将 2D 精灵添加到 3D 游戏中,并实现阴影投射效果,实现类《八分旅人》《饥荒》等等的2.5D游戏效果
游戏·3d·unity·编辑器·游戏引擎·材质
TOSUN同星2 天前
干货分享 | TSMaster DBC编辑器操作指南:功能详解+实战示例
数据库·oracle·编辑器·汽车·软件工程
LIN-JUN-WEI2 天前
[ESP32]VSCODE+ESP-IDF环境搭建及blink例程尝试(win10 win11均配置成功)
c语言·开发语言·ide·vscode·单片机·学习·编辑器
Ronin3052 天前
【Linux系统】vim编辑器 | 编译器gcc/g++ | make/Makefile
linux·运维·服务器·ubuntu·编辑器·vim
织_网2 天前
Visual Studio Code 中统一配置文件在团队协作中的应用
ide·vscode·编辑器
雷羿 LexChien2 天前
从 Prompt 管理到人格稳定:探索 Cursor AI 编辑器如何赋能 Prompt 工程与人格风格设计(上)
人工智能·python·llm·编辑器·prompt
不知所云,3 天前
3. lvgl 9.3 vscode 模拟环境搭建 lv_port_pc_vscode-release-v9.3
ide·vscode·编辑器·c·sdl·lvgl vscode·lvgl模拟器
淡漠的蓝精灵3 天前
【2025】Sublime Text 4安装教程保姆级一键安装教程(附安装包)
其他·编辑器·sublime text
yanjiee4 天前
需要scl来指定编译器的clangd+cmake在vscode/cursor开发环境下的配置
ide·vscode·编辑器
hero_heart4 天前
vscode中c_cpp_properities.cpp文件生成和作用
ide·vscode·编辑器