如何在 WordPress 中查找和修复损坏的图像

已发表: 2022-08-11

如何在 WordPress 中查找和修复损坏的图像 您可能已经在您的网站上看到了一个看起来像一张被撕毁的图片的图像图标。 这是一个损坏的图像,如果您不替换它,它可能会对您的网站产生负面影响

图像对大多数网站都很重要。 除其他外,它们使您的页面更具吸引力,传达关键信息并提高您的搜索引擎排名。

因此,一旦发现损坏的图像并在您的网站上找到并修复它们,这一点很重要。 在本指南中,我们将解释什么是损坏的图像,并向您展示如何在您的 WordPress 网站上修复它们。

内容:

  • 什么是残缺图像?
  • 在您的网站上检测损坏的图像
  • 如何修复损坏的图像问题
    • 文件路径不正确
    • 交叉检查文件名
    • 文件扩展名不正确
    • 使用相对路径
    • 确保图像存在
    • 转移问题
  • 结论

什么是残缺图像?

简而言之,损坏的图像是源链接不可用或损坏的图像。 当用户滚动到您网站上图像损坏的部分时,他们将看到损坏的图像图标。 这可能是由于 URL 拼写错误、文件路径不正确,或者您可能链接到不再存在的站点。

破碎的图标图像

这是一个关键问题,因为它会对用户体验产生负面影响。 当用户在您的网站上遇到丢失的图像时,他们往往会离开您的网站去寻找竞争对手。

因此,您网站上的跳出率会增加。 因此,为防止这种情况发生,请始终扫描您的站点以查找损坏的图像并修复它们。 让我们在下一节中看看如何做到这一点。

在您的网站上检测损坏的图像

在 WordPress 网站上检测损坏图像的最简单方法是使用插件。 此类插件之一是 Broken Link Checker。 使用此插件,您可以扫描网站的内部和外部链接以查找任何损坏的链接和图像。

断开链接检查器插件

安装并激活插件后,您可以通过Settings >> Link Checker访问插件的设置页面。

断开的链接检查器选项

Broken Link Checker 插件会扫描您的网站以查找损坏的链接。 如果有任何问题,您将在此处查看或通过电子邮件收到通知。

防止搜索引擎跟踪损坏的链接

该插件还为您提供了防止搜索引擎跟踪损坏链接的选项。 您可以启用此选项,以便损坏的图像不会影响您的 SEO 排名。

修复损坏的图像

有几种情况可能会导致 WordPress 网站上的图像丢失。 在本节中,我们将讨论原因以及如何解决它们。

文件路径不正确

将图像添加到您的网站时,WordPress 会创建一个指定图像位置的文件路径。 Web 浏览器使用图像 src 属性中的路径来定位图像。 如果图片的路径不正确,图片将无法加载,也不会显示。

要解决此问题,只需找到带有损坏图像图标的帖子或页面,然后将其替换为新图像。 为此,请登录您的仪表板并导航到您的 WordPress 帖子页面。 然后将鼠标悬停在带有损坏图像的帖子上并选择Edit 。

转到所有帖子,然后单击帖子名称下的编辑

在帖子编辑器上,滚动到带有损坏图像的部分,然后单击它并选择Replace 。 您可以从媒体库中选择图像或上传新图像。

单击损坏的图像并选择替换

替换损坏的图像后,单击更新以保存更改。

单击更新按钮以保存更改

如果您使用的是经典编辑器,请单击图像,然后选择钢笔图标来编辑损坏的图像。

单击笔图标

在这里,单击替换按钮,然后从您的媒体库中选择一个图像。 最后,单击更新以替换图像。

从媒体库中,单击替换按钮

替换自定义 HTML 图像

如果您使用自定义 HTML 或 CSS 添加图像,则需要验证路径是否正确。 要验证这一点,您需要检查添加图像的位置。 它可能在 Additional CSS 块上。 如果是这种情况,请按照以下步骤操作。

旁注:替换模板中的图像可能是技术性的。 如果您是 WordPress 新手,您可以让我们的专家帮助您解决模板问题。

首先,登录您的 WordPress 仪表板,然后转到外观>>自定义。

转到您的 wp 定制器

之后,选择附加 CSS 块或自定义 CSS 菜单。

选择自定义 CSS 菜单

在代码编辑器上,找到添加图像的代码行并突出显示图像的路径。 接下来,右键单击,然后选择Go to path-to-file ...

选择 Go-to-path-to-file

如果图像不可用,您将收到 404 not found 错误。 您只需将图像重新上传到您的网站,然后将链接复制并粘贴到此处即可。

404错误页面

要上传图像,请转到媒体 >> 添加新的。 之后,单击选择文件,然后选择图像文件。 上传完成后,单击将 URL 复制到剪贴板按钮。

上传图片然后复制到url

现在返回定制器页面,将损坏的图片链接替换为您刚刚上传的链接。 最后,单击发布以保存您的更改。

替换损坏的图像链接,然后单击发布

交叉检查文件名

这是图像加载问题的常见原因。 确保图像的拼写与媒体库中的拼写相同。 错误也可能只是不同的特殊字符。 键入下划线 (_) 而不是破折号 (-) 可能会导致图像损坏。

要解决此问题,您需要将帖子或页面上的文件名与媒体库中的原始图像进行比较。 为此,请登录您的 WordPress 仪表板,然后转到Media >> Library 。

WordPress 媒体库

现在,使用搜索框查找要比较的图像。 之后,将鼠标悬停在图像上,然后选择View 。

在地址栏上,您将看到图像的路径。 突出显示的部分是图像的名称,如下所示。

图片文件路径

现在转到带有损坏图像的帖子并验证文件名。 为此,请在浏览器上打开页面,然后右键单击损坏的图像并选择Open image in new tab 。

选择在新标签页中打开图片

如果两个文件名之间存在差异,则可能是图像未显示的原因。 您最终会看到 404 not found 错误。

404 未找到错误

要解决此问题,您需要使用损坏的图像编辑帖子并将错误的文件名替换为媒体库中的文件名。

替换错误的文件名

更正文件名后,您应该会看到帖子编辑器上显示的图像。 如果没有,您可以重新上传图片并将其添加到您的帖子中。 确保更新帖子以保存更改。

文件扩展名不正确

您还应该检查文件扩展名。 有时,文件名可能拼写正确,但文件扩展名可能不正确。 例如,您可以将图像上传为 .jpg 文件,但在代码中,它是 .png 扩展名。 这可能会导致问题。

“jpg”和“jpeg”图像扩展名出现另一个常见问题。 尽管这两种格式相同,但如果将一种格式换成另一种格式,您可能会遇到损坏的图像错误。

使用相对文件路径

相对路径链接到与主页 URL 相关的文件。 在WordPress中,一个相对路径取出域名,并且只使用域后面的路径。

因此,在“src”属性中,源不是“https://example.com/wp-content/uploads/image.png” ,而是“/wp-content/uploads/image.png” 。 并且您的图像将与短链接一起正常工作。

使用相对路径的好处之一是即使您更改了域名,您的图像也能正常工作。 只要文件仍然托管在同一台服务器上,就会出现这种情况。

您可以使用 Make Paths Relative 插件等插件来强制 WordPress 为您的媒体文件使用相对路径。 该插件易于安装和设置。

制作路径相对插件

安装并激活插件后,转到Make Paths Relative >> Settings打开插件设置页面。

进行路径相对设置

在这里,勾选启用图像相对路径的选项,然后单击保存更改以注册您的更改。 您现在将能够使用相对路径在页面上显示图像。

确保图像存在

您可能已链接到托管在不同网站上的图像。 如果该站点出现故障或重新定位到其他服务器,则图像将不复存在。

此外,直接链接到另一个站点会增加您从中获取图像的站点上的服务器使用率。 如果主机网站禁用热链接,它将阻止您的图像显示。

为防止这种情况发生,最好先将每张图片上传到您的网站,然后再将它们添加到页面。 此外,除非您有权使用,否则请避免使用来自第三方网站的图片。

转移问题

这不是一个常见的问题,但确实会发生。 有时,您的服务器会不堪重负,无法在请求超时之前足够快地加载所有页面资源。

它主要发生在廉价的网络服务器上。 要解决此问题,您需要升级服务器容量或迁移到可靠的 Web 主机。

您还可以使用插件为图像启用延迟加载。 当您启用它时,您的服务器只会在用户滚动到该部分时加载图像。 这将释放您的服务器资源并加快您的网站速度。 您可以在我们的速度优化指南中了解更多信息。

摘要–修复损坏的图像

网站遇到图像损坏或丢失的问题并不少见,但这是一个非常严重的问题,应该及时处理。 如果您有在线商店,如果用户在您的商店中看不到产品图片,您可能会失去潜在客户。

在本指南中,我们解释了图像损坏的一些原因以及如何在 WordPress 网站上修复它们的提示。

修复损坏的图像是降低网站跳出率的一种方法。 您还需要优化图像以提高网站的性能。 有关这方面的详细教程,请查看我们的图像优化指南。