您想在 WordPress 中创建 404 错误页面吗?

如果查看者试图打开或访问服务器上未找到的页面,他们将被带到 404 错误页面。通过显示 404 页面,您基本上是在让访问者知道该页面不存在。

虽然 404 错误页面非常适合让您的访问者知道出了什么问题,但它也有可能让您失望。

这是因为适当的 404 页面可能会损害或改善您的用户体验 (UX)。

通过正确设计此页面,您可以战略性地引导用户在哪里找到他们正在寻找的内容。这是留住访问者并降低跳出率的最佳方式,而不是将他们赶出您的网站。

在本文中,我们将向您展示如何以最简单的方式设计一个 404 错误页面,而无需任何编码。

我们还将告诉您导致 404 错误的原因以及修复方法。最后,我们将向您展示一些最鼓舞人心的 404 错误页面示例,供您在创建页面之前检查一下。

请随意使用此目录找到适合您的部分:

  1. 导致 404 错误的原因
  2. 如何修复 404 错误
  3. 如何使用 Beaver Builder 设计 404 错误页面
  4. 最佳 404 错误页面示例灵感

让我们开始吧。

导致 404 错误页面的原因

通常,当访问者试图查找已被删除、删除或移动到另一个 URL 的内容时,会显示 404 错误页面。

但是当您的访问者看到此错误消息时,可能还有其他原因。例如:

  1. 搜索页面的 URL 段在没有正确重定向的情况下发生了变化。因此,在查找页面时,您的用户会找到具有原始 URL 的原始页面。
  2. 搜索到的域已经不存在了。这很可能是因为用户输入了错误的 URL
  3. 负责该站点的服务器未运行,或者连接丢失。

而且,一旦发现问题,您就需要弄清楚如何解决它。

如何修复 404 错误

登陆 404 错误页面可能会令人沮丧。这就是为什么您必须知道如何修复它的原因。如果您在自己的网站或其他网站上看到 404 错误页面,请尝试以下提示。

  1. 检查 URL 是否有错误:首先要做的是检查 URL 是否有错误。确保您输入的 URL 正确,并且不包含任何拼写错误的单词,或缺少正斜杠、连字符等字符。
  2. 清除浏览器缓存和 cookie 注意:如果您只能看到来自特定计算机的 404 错误页面,此解决方案将像魔术一样工作。在这种情况下,请尝试删除您的浏览器缓存和该站点的所有 cookie,然后重试。
  3. 重新加载页面:有时只需重新加载页面即可找到 404 错误页面的解决方案。因此,刷新页面以查看页面是否正常运行。
  4. 检查目录级别:如果显示错误的URL具有以下结构:example.com/Directory1/Directory2/Directory3,您可以回到上一级目录。例如,您可以转到 example.com/Directory1/Directory2/ 检查是否可以在那里找到您想要的页面。如果这不起作用,请返回到另一个目录。
  5. 直接联系站点:寻找解决方案的另一个好步骤是直接联系站点。您可以在网站主页上找到联系方式。他们应该能够告诉您该页面是否已被完全删除。
  6. 使用本站的搜索功能:您也可以使用本站的搜索功能,输入一个或多个您要查找的关键字,即可找到您要查找的特定页面。

现在,我们将向您展示如何为您的网站创建 404 错误页面。本部分对希望向用户显示此错误页面的网站所有者很有帮助。

如何使用 Beaver Builder 设计 404 错误页面

要在本教程中设计 404 错误页面,我们将使用 Beaver Builder 页面构建器。

海狸生成器功能强大拖放页面构建器插件允许您在不知道任何代码的情况下为您的网站创建漂亮的页面。

您可以在此详细评论中找到有关 Beaver Builder 的更多信息。

除了 Beaver Builder 插件之外,您还需要在您的网站上安装 Beaver Themer。 Beaver Themer 是一个附加程序,可以使用 Beaver Builder 轻松快速地设计网页。您不需要单独安装此插件。它带有高级版的 Beaver Builder 插件。您需要做的就是在您的网站上激活它。

第 1 步:在您的网站上安装 Beaver Builder

要开始,您首先需要在您的 WordPress 网站上安装并激活 Beaver Builder 插件。

安装并激活后,转到设置 » 页面生成器。您可以在此处输入您的许可证密钥以启用支持和接收更新。

接下来必须激活Beaver Themer 插件。为此,请转到仪表板并单击插件»已安装的插件。

在这里,你会看到海狸 Themer 插件。只需单击插件的激活按钮即可开始工作。现在您可以创建自定义 404 错误页面。

第 2 步:添加主题布局

现在,在仪表板上,转到 Beaver Builder » Themer Layouts。然后点击添加新的。

这会打开一个新的屏幕,您将在其中看到一个用于添加标题并选择页面类型和布局的字段。添加 404 错误页面作为页面标题。对于布局,从下拉列表中选择 404。现在,单击“添加主题布局”按钮。

您将在screen 查看一个新窗口。在这里,单击启动 Beaver Builder。

现在,你可以开始使用Beaver Builder提供的模块(图片、链接、按钮等)设计404错误页面。如果您没有看到该模块,请单击屏幕右上角的 + 按钮。

当你点击按钮时,它将显示所有可以拖放到可视化编辑器中以创建 404 错误页面的 Beaver Builder 模块。如上图,+ 号将变为十字号。

如需更多帮助,您可以在此处查看有关如何将模块添加到 Beaver 页面的详细信息。您可以使用这些模块,添加图像和链接,并使它们丰富多彩并吸引用户。

第三步:发布404错误页面

页面创建完成后,点击页面右上角的“完成”按钮。

这会显示“发布”按钮。点击它。

您的 404 错误页面现已上线。任何点击损坏链接的人都会看到此页面。

就是这样!您的 404 页面已准备就绪。简单吧?

现在,让我们看看在 404 页面的一些很好的示例中,以便您在设计自己的页面时获得更多灵感。

最佳 404 错误页面示例灵感

为了帮助您更好地设计 404 错误页面,我们为您提供

1. Themeisle 404错误页面

Themeisle 的404 错误页面不仅视觉上很吸引人,而且还为访问者提供了一种查找所需内容的解决方案。它在页面中添加了一个搜索字段,访问者可以在其中搜索输入一个或多个ke他们要访问的页面的关键词。

这是留住用户并将他们引导到他们想去的地方的好方法。

2. 404错误页面,作者:Andrew Colling

Andrew 的 404 错误页面是另一个可以启发您的例子。它添加了精美的图形,与标题下方添加的描述产生共鸣,并幽默地尝试将访问者重定向回主页。它添加了一个有吸引力的号召性用语 (CTA) 按钮,将人们引导至可以浏览该网站的页面。

3. Ryan Duffy的404错误页面

Ryan Duffy 的设计简单而有力。它告诉访问者,就像偶然一样,404 错误页面的登陆是无意的。但与此同时,它还向他们展示了一种通过使用 CTA 返回主页来退出该页面的方法。

4. Matt的404错误页面

这个页面与上面的其他页面不同。它不仅告诉访问者该页面不存在,而且还提供了不同的解决方案。它在标题中添加了不同的链接,以帮助访问者访问网站的其他部分。

这实际上是吸引访问者的好方法,因为您为他们提供了不同的选择,因此他们可以自由选择他们想做的事情。

这就是您在 WordPress 中创建 404 错误页面的方式。我们希望本文能帮助您为您的网站创建漂亮的 404 错误页面。

创建完错误页面后,您可能想查看一些插件,它们可以帮助您轻松查找和修复网站上的损坏链接。

这将通过消除网站上的死链接或损坏链接来帮助您改善用户体验。

帖子 如何在 WordPress 中创建自定义 404 错误页面 第一篇文章 IsItWP - 免费的 WordPress 主题检测器。