如何在WordPress中添加SVG图像文件

准备好为您的 WordPress 网站进行一次重大的图形升级了吗？想象一下，一个可无限缩放的徽标和图标，在任何设备上都能清晰显示，没有像素化，没有失真。本指南将向您详细展示如何使用 WP Media Folder在 WordPress 中上传和管理 SVG 文件，它适合所有人，即使您不是开发人员。

在本步骤的教程中，我们将解开SVG文件的好处，为什么设计师喜欢它们以及为什么它们在SEO和页面性能中出色。您将学习多种易于遵循的方法来启用SVG上传：从使用受信任的插件到简单的代码调整，再加上智能策略以确保您的网站安全。

我们将使用 WP Media Folder，这是Joomunited的功能强大的媒体管理插件。 

为什么SVG对于可扩展图形很棒

可伸缩性- SVG是向量文件。这意味着您可以放大，放大或缩小它们，而不会因徽标，图标或响应式设计而失去质量。

轻量级和SEO友好- SVG文件通常比栅格图像小，并且是基于文本的XML，因此搜索引擎可以直接读取关键元素（ALT文本，标题等）。

样式和动画- 您可以通过CSS或JavaScript操纵SVG。想要悬停效果还是动画？简单的。

可访问性- 正确设置的SVG包含屏幕读取器可以解释的可访问的文本标签和角色，这只是使用它们的另一个可靠的理由。

在WordPress中添加SVG的解决方案

默认情况下，WordPress块SVG由于安全风险（SVG为XML，可能包括恶意代码），但是，有三种可靠的方法可以启用SVG支持：

1。使用插件

a） WPCode + SVG片段

• 安装免费的WPCode插件。
• 从其库中添加“允许SVG文件上传”片段并激活它。
• 默认情况下，只有管理员可以上传SVG。

b） SVG支持插件

• 通过插件安装“ SVG支持”>添加新，激活它。
• 在其设置中，检查“限制到管理员”和/或“启用高级模式”（内联渲染，CSS样式）。
• 通过媒体上传您的SVG>添加新的或拖放。

c）其他选项：

• SVG Safe Safe ，年龄较大，但仍然使用。
• SVG支持消毒了上传，以防止XSS/XXE风险。
• HappyFiles/Catfolders添加了SVG上传，并进行了消毒和预览。

2。将代码段添加到functions.php

您可以使用以下代码： 

函数enable_svg_upload（$ mimes）{$ mimes ['svg'] ='image/svg+xml';返回$ Mimes； } add_filter（'upload_mimes'，'enable_svg_upload'）; 

地点： them's functions.php（始终cuse them theme！）。

缺点：默认情况下没有消毒 - 除非与消毒剂配对，否则风险。并上传到管理员（您可以自定义）。

3。安全考虑

 SVG = XML，可以包含：

• XSS攻击（JavaScript）。
• XXE攻击（外部实体调用）。

最佳实践：

• 使用SVG支持，SVG安全，HappyFiles，and -happyfiles的插件。
• 通过在线工具（例如Darryll Doyle的SVG消毒器测试）进行消毒。
• 将SVG上传到管理员或受信任的用户。

WP Media Folder 及其在WordPress上对SVG很重要的原因

WP Media Folder 是功能强大的媒体库经理

- 文件夹/子档位结构

- 节能过滤器，排序，拖放和滴

 - 重命名，水印，散装替换，预览，下载

- 与许多工具兼容，例如页面构建器，WooCommerce和WPML。

尽管 WP Media Folder 本身不允许使用SVG文件，但它将允许我们组织，维护和管理任何类型的文件，包括SVG文件。

总结：使用SVG和 WP Media Folder提升您的网站

停止使用混乱的媒体文件夹和不优化的图像文件搏斗。取而代之的是，使用 WP Media Folder的直观组织工具解锁SVG，轻巧，可搜索和适应性的全部潜力。 

无论您是内容创建者，设计师还是小型企业主，它都将强大的技术掌握在没有任何代码的情况下。您的网站将加载更快，排名更高，看起来令人惊叹！你还在等什么？去这里，获取自己的副本。