资源部分

资源部分可让您上传和组织网站的所有资源。此部分位于设计器的左侧工具栏中。在此区域内，您可以上传资源、将其分类到文件夹中、按类型（图像、文档或 Lottie）进行过滤，并无缝地将其拖放到 Webflow 画布上。

通过本教程，您将深入了解以下内容：

1. 添加资源
2. 兼容的文件格式
3. 命名资源
4. 利用资源
5. 删除资源
6. 过滤和组织资源

添加资源

笔记： 上传到资源部分的文件包括 没有限制 — 这意味着它们是公开可访问和可搜索的，但除非文件链接到可公开查看的网页上，否则搜索引擎不会自动将其编入索引。有关资源隐私的更多详细信息，请参阅 Webflow。

有三种方法可以在您的网站中包含图像或文件：

• 单击资源部分中的“云”上传图标
• 直接将资源拖放到资源部分
• 将资源直接拖放到画布上

笔记： 仅上传您拥有必要的使用和分发权限的文件。

将资源上传至资源部分

要将资源添加到资源部分：

1. 访问“资源”图标
2. 点击 ”云”上传图标
3. 从您的设备中选择一个或多个图像或文件

提醒： 如果上传的文件已存在于资源部分，且名称不同，则如果文件未发生改变（即大小或尺寸保持不变），则将保留原始名称。要上传名称不同的相同资源，必须对文件进行修改。 

直接将资源添加到画布

您还可以将一个或多个图像或文件从设备直接拖到画布上，而无需打开“资源”部分。此操作将自动生成图像元素或创建指向文件的链接。图像或文件还将添加到“资源”部分以供将来使用。

笔记： 由于浏览器限制，无法直接将 dotLottie 文件拖到画布上。不过，可以将 dotLottie 文件上传到资源部分。

兼容的文件格式

资源部分兼容各种图像文件类型、下面列出的 document 类别以及 Lottie JSON 和 dotLottie 动画文件。

提醒： 图像文件大小不得超过 4MB，documents 不得超过 10MB。

支持的图像文件扩展名

• 巴布亚新几内亚
• JPEG 和 JPG
• 动态图片
• SVG
• WebP

支持的 document 文件类型

• PDF
• DOC 和 DOCX
• XLS 和 XLSX
• PPT 和 PPTX
• TXT
• CSV
• 光发射断层扫描
• 消耗臭氧层物质
• 臭氧消耗量指数

支持的 Lottie 文件类型

• JSON（仅限 Lottie）
• dotLottie

额外提示： 有三种方法可以获取 dotLottie 文件。您可以 转换 使用 JSON 到 dotLottie 转换工具, 产生 使用 After Effects 直接创建 dotLottie 文件 LottieFiles 插件， 或者 下载 预先设计的 dotLottie 文件来自 LottieFiles.com.

命名资源

为了防止在将资源上传到资源部分或画布时出现问题，请在命名资源时考虑以下事项：

1. 你 被允许 使用字母、数字、连字符和下划线（URL 中允许用于链接到资源的字符）
2. 避免 文件名中的特殊字符（例如，`#, (), ' ,`）
3. 保持文件名简洁（100 个字符或更少， 包括 文件扩展名）

提醒： 为了提高加载速度，请确保图像小于 4MB — 调整大小、优化和/或压缩大文件。使用免费的第三方工具，例如 压缩JPEG 或者 压缩PNG。您还可以使用Webflow转换工具将资源转换为WebP格式来压缩资源。

提醒： 如果文件以不同的名称上传到资源部分，但保持不变（即大小或尺寸不变），则将保留原始名称。要以新名称上传相同的资源，必须修改文件。 

利用资源

一旦资源在资源部分中可用，您就可以将它们合并到您的网站中。添加后，图像将显示为图像元素，文件将显示为文本链接。

将资源附加到链接元素

您可以通过链接设置将资源链接到链接元素。要将资源链接到链接元素：

1. 选择 link 元素 （链接块、文本链接或按钮）在画布上
2. 导航 设置面板 > 链接设置
3. 点击 ”回形针”文件图标
4. 选择 选择附件

当访问者点击链接时，图像或 document 文件将在同一选项卡中打开。其他文件类型将下载到访问者的设备中。

如果您希望修改链接的附件，您可以 代替 链接设置中的附件。您还可以调整设置以将图像或 document 文件 在新标签页中打开 点击后。

利用图像资源作为背景图像

要使用上传的图像资源作为背景图像：

1. 选择画布上的元素作为背景图像
2. 使用权 样式面板 > 背景
3. 点击 ”加”图标旁边 图像和渐变
4. 选择 选择图片
5. 在 资源部分

有关背景图像样式的更多信息，请探索更多资源。

提醒： 上传具有正确分辨率的优化背景图像，因为 Webflow 不会为背景图像生成响应式变体。了解有关背景图像分辨率的更多信息。

搜索资源

您可以使用资源部分中的搜索栏或使用快速查找来查找资源。可以通过快捷方式访问快速查找 命令 + 埃 （在 Mac 上）或 控制 + 埃 （在 Windows 上）。使用快速查找时，请确保 使能够 功能.资源发现。

如果您希望在快速查找功能中激活资源发现：

1. 进入 命令 + 埃 （在 Mac 上）或 控制 + 埃 （在 Windows 上）启动 快速查找
2. 按下齿轮图标
3. 选择 包括资源

消除资源的步骤

当您删除画布上的资源版本时，它 才不是 删除资源面板中的资源。要从资源面板中删除资源，请执行以下操作：

1. 访问 资源面板
2. 将鼠标悬停在您想要消除的资源上
3. 点击资源右上角的齿轮图标
4. 按 删除

请记住，如果从资源面板中删除仍在您网站上某处使用的资源，则在您发布网站并刷新设计器后，该资源会重新出现在资源面板中。必须从您的网站中删除该资源的所有实例， 然后 从资源面板中将其完全删除。

关键信息： 通过选择资源的齿轮图标来揭示 资源详细信息 模式，您可以查看其 方面, 尺寸和/或 框架.

资源分类和排列方法

为了更方便地找到特定资源，您可以在资源面板中进行多种过滤和排序选择。

筛选资源的流程

最初，所有类型的资源都显示在资源面板中。要按文件类型过滤资源：

1. 启动 资源面板
2. 按下面板左上角的下拉菜单
3. 选择要展示的 category 资源 (所有资源, 图片, 文件， 或者 洛蒂)

资源排序流程

最初，资源面板中的资源按从最新到最旧的方式排列。您可以按以下方式对资源进行排序： 新的先来, 最早， 或者 按字母顺序（AZ 或 ZA）. 对资源进行排序：

1. 访问 资源面板
2. 按下面板左下角的下拉菜单
3. 选择排序首选项（例如， 新的先来, 最早, 按字母顺序 (AZ)， 或者 按字母顺序 (ZA))

修改资源面板显示选项的流程

最初，资源面板中的资源使用网格视图展示。您可以以网格视图查看资源 网格, 列表， 或者 列表 – 小 选项。要更改视图选项：

1. 启动 资源面板
2. 按 ”网格”图标位于面板左下角
3. 选择查看选项（例如， 网格, 列表， 或者 列表 – 小)