如何创建自定义WordPress 404错误页面

zisu 29

错误404是访问者尝试访问不存在的页面时。有时人们倾向于忽略这个功能,而从不考虑为它设计。花时间制作一个用户友好的404页面可能意味着用户留在您的网站或离开的差异。

您有可能创建了自己的网站并多次检查以确保每个链接都指向某个地方。最终,随着时间的推移,您可能会忘记导致您删除的帖子或可能更改名称的链接。即使访问者直接搜索页面并且他们没有正确搜索,他们也会被带到错误404页面。

利用WordPress模板标签和一些技术诀窍,可以使用户非常友好。

了解错误404

错误404是访问者在找不到页面或帖子时将收到的消息。这默认包含在WordPress中,但不包含所有主题。如果您已经创建了自定义主题,那么即使他们没有通过正确设计的404页面找到他们想要的内容,您也可以增加用户坚持使用的机会。

基本错误404模板

一些WordPress主题包含基本错误404模板,但不是全部。WordPress设置为在404.php达到错误404时自动查找文件。如果此文件不存在,那么它将给出一个用户不友好的基本错误消息。

如果您还没有此文件,则可以创建它。创建一个新的空白文件并命名404.php

以下是我们将开始的基本代码:

404.php文件

<?php get_header(); ?>
<h2>Error 404 - Page Not Found.</h2>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

404.php文件中的上述代码将给出一个包含在H2标签中的简单输出,该标签将显示为“错误404 - 未找到页面”。 - 它还将获得WordPress标题,补充工具栏和页脚。这些都是可选的,应该修改以适合您的WordPress主题。

我们希望进一步实现这一目标。请注意我使用get_header()以及get_sidebar和footer来调用我们的主题模板文件。您的可能会略有不同,您必须相应地调整您的404.php文件。

开始研究它

首先,我们将搜索表单添加到我们的基本404页面,以使其更有帮助。这样,即使访问者登陆您的404,他们也可以选择搜索您的网站。这是第一种帮助用户坚持而不是离开的方法。

404.php文件 - 添加了搜索表单

<?php get_header(); ?>php get_header(); ?>
<h2>Error 404 - Page Not Found.</h2>
<h2>Error 404 - Page Not Found.</h2>
Search:
<?php include(TEMPLATEPATH . "/searchform.php"); ?>
<?php include(TEMPLATEPATH . "/searchform.php"); ?>
<?php get_sidebar(); ?><?php get_sidebar(); ?>
<?php get_footer(); ?><?php get_footer(); ?>

让它更具活力

要创建更加动态的错误404页面,您可以使用重定向,以便用户只能短暂地看到错误,然后重定向到您的主页。这个页面也可以有点SEO友好。

对于下一个示例,我们可以从编辑header.php模板的文件开始。在header.php文件顶部的元标记内,您可以添加以下内容:

header.php文件

<?php if (is_404()) { $redirectHome = get_option('home'); ?>php if (is_404()) { $redirectHome = get_option('home'); ?>
<?php echo $redirectHome; ?><?php echo $redirectHome; ?>

添加完成后,我们将编辑我们的404.php文件,如下所示:

404.php文件

<?php get_header(); ?>
<h1>Error 404 - File Not Found.</h1>
<h3>Please <a href="<?php bloginfo('home'); ?>" Click here</a> to return to our home page, or you can wait to be redirected in 15 seconds.</h3>
<?php get_footer(); ?>

上面的示例将允许用户登陆404错误页面,但随后自动将它们带回主页。这也可以帮助用户留下来,而不是让他们感到困惑,离开你的网站。

此示例可能并不总是适合所有人的最佳解决方案,但对于在您的网站上寻找特定内容的人可能会有所帮助。

确保它有效

您可以通过键入URL并使用您知道不存在的页面跟随它来测试404错误页面。

例: http://www.yourwebsitedomain.com/test404page.php

这应该会带您到404页面进行查看和测试。

如果它不起作用

如果您的服务器没有自动将您带到您的404.php文件,我们可以修改.htaccess文件以使其正常工作。在WordPress安装中找到.htaccess文件并向其添加以下行:

ErrorDocument 404 /index.php?error=404

如果你的WordPress安装不在根目录中,你需要确保上面的代码反映了这一点。如果您已将WordPress安装到子文件夹中,请修改.htaccess,如下所示:

ErrorDocument 404 /YOURSUBFOLDERNAME/index.php?error=404

这将强制使用您的404.php文件。

一个完整的例子

下面的代码是一个完整的演示,它将向您展示一些可以使用该404.php文件来帮助找到不存在的用户的方法。看看它,注意我们给他们留下的选项,并帮助他们找到内容。

<?php get_header(); ?>
<h1>404 Error</h1>
We cannot seem to find what you were looking for.
Maybe we can still help you.
<ul>
<li>You can search our site using the form provided below.</li>
<li>You can visit <a href="<?php bloginfo?>"</a></li>
<a href="<?php ('url'); ?>" the homepage.</a>
<li>Or you can view some of our recent posts.</li>
</ul>
Search:
TEMPLATEPATH . "/searchform.php"); ?>
<h3>Recent Posts</h3>
<ul>
<?php query_posts('posts_per_page=5'); if (have_posts()) : while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>" title="Permalink for : <?php the_title(); ?>"><?php the_title(); ?></a>
endwhile; endif; ?>
</ul>
<?php get_footer(); ?>

以上任何内容都可以更改和设计,以满足您的需求。在上面的示例中,我们显示存在错误,然后使用用户的选项列表跟随它。我们还在为他们提供搜索我们网站的选项,现在他们已经添加了查看我们最近帖子的功能。

所有这些的组合为用户提供了到达页面选项。这些选项可用于确保用户不会立即离开,如果他们没有找到他们想要的确切内容。

让它更友好

为了使其更加用户友好和独特,您可以考虑使用上面的示例和您选择的不同背景图像。您还可以在404.php文件中使用html 为您的错误页面创建一个页面。以下是一些独特错误404页面的灵感示例:

1. Mundofox.com

如何创建自定义WordPress 404错误页面

2. CSSRemix.com

如何创建自定义WordPress 404错误页面

3. CSSRemix.com

如何创建自定义WordPress 404错误页面

4. ChrisJennings.com

如何创建自定义WordPress 404错误页面

5. ook.co.uk

如何创建自定义WordPress 404错误页面

6. Youcastr.com

如何创建自定义WordPress 404错误页面

7. Mixx.com

如何创建自定义WordPress 404错误页面

8. JustCreativeDesign.com

如何创建自定义WordPress 404错误页面

9. agens.no

如何创建自定义WordPress 404错误页面

10. Mushroomdigital.co.uk

如何创建自定义WordPress 404错误页面

明智地使用它

对于WordPress和静态HTML网站来说,使用404页面总是很好的做法。要么使用广告来获利,要么使用它来更好地帮助访问者浏览您的网站。

有很多方法可以创建自己的自定义404错误页面,并且有很多方法可以帮助网站访问者。自由使用上面的例子,并试验最适合你的方法。

分享
微信
微博
QQ