通常也称为“主图”或“横幅”图片,“封面”区块可用于在您的站点上添加大型图片、视频或文字横幅。本指南将向您介绍如何添加横幅,以及如何选择要显示的图片、视频或颜色。
在本视频中,您将学习如何使用“封面”区块为您的 WordPress.com 站点添加视觉页眉或横幅样式的版块。视频涵盖如何添加背景图像或视频、在上方放置文本或其他区块、调整布局和焦点、自定义叠加层,以及在移动设备上预览设计。
您可以使用“封面”区块为您的站点添加横幅图片。要在 页面、文章或 模板中添加横幅,请按以下步骤操作:
- 前往您站点的 控制台。
- 根据您想要添加横幅的位置,前往页面、文章或模板,然后编辑现有内容或新建一个:
- 页面:前往菜单中的 页面 部分。
- 文章:前往菜单中的 文章 部分。
- 模板:前往 外观 → 编辑器,然后选择模板。
- 点击 +(区块插入器) 图标,然后搜索“封面”。
- 或者,在显示 “键入 / 以选择区块” 的位置输入 /封面。

- 点击封面图标以插入 “封面”区块:

添加 “封面”区块后,请选择要显示的媒体。您可以从以下选项中进行选择:
- 上传:点击“上传”按钮,从您的计算机中选择文件。
- 选择媒体:从以下位置查找媒体:
- 媒体库:您已上传到站点媒体库中的图片和视频。
- 您的手机:使用 Jetpack 移动应用程序,直接从手机上传媒体。
- 使用 AI 生成:简要描述您想使用的图片类型,AI 就会创建设计。
- Google Photos:从您已连接的 Google Photos 账户中选择媒体。
- Pexels:从 Pexels 库中搜索免费图片。
- Openverse:从 Openverse 库中搜索免费图片。
- 使用特色图片:设置后,会显示页面或文章的特色图片。如果将 “封面”区块添加到模板并选择此选项,系统会自动显示所有使用该模板的页面或文章的特色图片。
- 颜色:您也可以不添加图片或视频,而是为横幅选择一种纯色。
接下来,您可以在横幅中添加文本和按钮等内容、自定义横幅布局,并调整横幅设计。
为横幅选择图片时,请考虑以下几点:
- 装饰性或抽象图片通常效果最好,因为在移动设备上,图片不一定总能完整显示。
- 请将文字直接添加到图片上方,而不要把文字设计在图片本身中。这样可以确保文字在各种屏幕尺寸下都能良好缩放。
- “封面”区块会将图片用作背景图像,在较小的设备上不会调整大小以显示整张图片的宽度。使用焦点选择器设置,您可以选择在较小屏幕上显示时要突出图片的哪个部分。
- 如果您希望图片中的内容在所有设备尺寸下都能完整显示,可以改用“图片”区块。
“封面”区块支持图片、视频和纯色。要将视频上传到“封面”区块,请按以下步骤操作:
- 将封面区块添加到页面或文章中。
- 在区块工具栏中,点击「添加媒体」选项:

- 选择以下任一项:
- 上传:从您的计算机上传视频文件(需要符合条件的套餐)。
- 打开媒体库:选择您已上传的视频文件。
- 从 URL 嵌入视频:粘贴来自 YouTube、Vimeo 或其他提供商的 URL。
封面区块主要用于装饰,而非播放功能,因此不会播放视频文件中的声音。如果您想包含视频音频,请使用 VideoPress 区块播放带声音的视频。
添加封面区块后,您可以随时更改媒体。要替换或移除横幅中的媒体,请按以下步骤操作:

- 在区块工具栏中,点击替换按钮,选择新的图片或视频。

您可以通过以下任一选项选择新的媒体文件:
- 打开媒体库:选择您已上传的图片。
- 上传:从您的设备中选择图片并上传到您的站点。查看支持的文件类型。
- 使用特色图片:使用页面或文章的特色图片。
- 重置:移除图片,但保留图片区块,以便您可以选择上传、选择图片、使用 AI 生成或从 URL 插入等选项。
- 您的手机:使用 Jetpack 移动应用程序从手机添加图片。
- 使用 AI 生成:通过描述您想要的内容,使用 AI 生成图片。
- Google Photos。
- Pexels 免费图片库。
- Openverse 免费图片。
- 从 URL 嵌入视频:粘贴来自 YouTube、Vimeo 或其他提供商的 URL