如何在 WordPress 中添加 SVG(使用 2 个简单的解决方案)

您想将 SVG 文件添加到您的 WordPress 网站吗?默认情况下,WordPress 允许您上传所有流行的图像、音频和视频文件格式,但 SVG 不在其中.在本文中,我们将向您展示如何在 WordPress 中轻松添加 SVG.

Easily add SVG files in WordPress

什么是 SVG?

SVG 或可缩放矢量图形是一种使用 XML 标记语言定义矢量图形的文件格式.SVG 的主要优点是它允许您放大图像而不会降低质量或产生任何像素化.

SVG 如何工作?

可缩放矢量图形 (SVG) 是一种使用 XML 显示二维绘图的技术.它们不同于常用的图像格式,如 PNG、GIF 或 JPEG.

如果您将 png/jpeg 图像文件放大,然后您会注意到图像会开始模糊并变得像素化.

矢量图不使用像素.相反,他们使用二维地图来定义您正在查看的图形.放大时,图像不会像素化.

这使您可以在不降低质量的情况下放大矢量图形.最重要的是,SVG 图像的文件大小可能比 JPEG 或 PNG 小得多.

矢量图通常用于图标、图标字体、网站徽标和品牌图像.您可能希望在 WordPress 中为您的公司徽标、图标或其他图形添加 SVG 文件.

尽管听起来很酷,但 SVG 文件仍然有点不安全.这就是 WordPress 默认不支持 SVG 文件上传的原因.

如果您在 WordPress 中上传 SVG 图片,那么您将看到以下错误消息:

抱歉,出于安全原因,不允许使用此文件类型.

SVG security error in WordPress

关于 WordPress 中 SVG 的安全问题

SVG 文件包含类似于 HTML 的 XML 标记语言代码.您的浏览器或 SVG 编辑软件会解析 XML 标记语言以在屏幕上显示输出.

但是,这会使您的网站容易受到 XML 漏洞的威胁.它可用于未经授权访问用户数据、触发暴力攻击或跨站点脚本攻击.

我们将在本文中分享的方法将尝试清理 SVG 文件以提高其安全性.但是,这些插件并不能完全阻止恶意代码的上传或注入.

最好的解决方案是仅使用由可靠来源创建的 SVG 文件,并将 SVG 上传仅限于受信任的用户.

要了解有关安全性的更多信息,请查看我们面向初学者的完整 WordPress 安全指南.

话虽如此,让我们来看看如何在 WordPress 中轻松安全地使用 SVG 文件.

方法 1.使用 SVG 支持在 WordPress 中上传 SVG 文件

此方法完全支持在 WordPress 中添加 SVG 文件.它还允许您在 WordPress 帖子和页面中显示内联 SVG.

首先,您需要安装并激活 SVG 支持插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

激活后,您需要访问设置» SVG 支持页面用于配置插件设置.

SVG support settings

在设置页面上,您需要选中"仅限管理员?"选项旁边的框.这将只允许站点管理员在 WordPress 中上传 SVG 文件.

下一个选项是打开高级模式.如果您想使用 CSS 动画和内联 SVG 渲染等高级功能,则只需选中此选项.

不要忘记点击保存更改按钮来存储您的设置.

您现在可以创建新帖子或编辑现有帖子.在帖子编辑器中,您将像上传任何其他图像文件一样上传 SVG 文件.只需将图像块添加到编辑器,然后上传 SVG 文件.

您现在可以在 WordPress 中上传和嵌入 SVG 文件.

SVG file embed in WordPress post

方法 2.使用安全 SVG 在 WordPress 中上传 SVG 文件

此方法还使用插件,并允许您对上传到 WordPress 的 SVG 文件执行清理.

您需要做的第一件事是安装并激活 Safe SVG 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

该插件开箱即用,您无需配置任何设置.您可以直接开始上传 SVG 文件.

缺点是该插件允许所有可以在您的 WordPress 网站上撰写帖子的用户上传 SVG.

为了控制谁可以上传文件,您需要购买插件的高级版本.

我们希望本文能帮助您了解如何在 WordPress 中安全地添加 SVG.您可能还想查看我们关于 WordPress 中最常见图像问题以及如何修复它们的文章.

6

发表回复