云策 WordPress 开发者社区

主题开发文档

404页面

查看官方原文 ↗
💡 云策文档标注

概述

本文档指导WordPress开发者如何为主题创建404页面，以处理用户访问不存在页面时的错误情况。核心步骤包括创建404.php文件、添加页眉、主体内容和页脚，确保页面提供导航帮助。

关键要点

  • 404页面对于主题至关重要，能引导用户找到正确页面。
  • 创建404.php文件并放置在主题文件夹中，通常基于index.php作为起点。
  • 在404.php中添加文件头注释并调用get_header()以包含主题页眉。
  • 添加主体内容，如标题、描述和搜索表单，可参考Twenty Thirteen主题示例。
  • 最后调用get_sidebar()和get_footer()添加侧边栏和页脚，完成页面功能。

代码示例

/**
 * The template for displaying 404 pages (Not Found)
 */
get_header();
?>
<div id="primary" class="content-area">
    <div id="content" class="site-content" role="main">
        <header class="page-header">
            <h1 class="page-title"><?php _e( 'Not Found', 'twentythirteen' ); ?></h1>
        </header>
        <div class="page-wrapper">
            <div class="page-content">
                <h2><?php _e( 'This is somewhat embarrassing, isn’t it?', 'twentythirteen' ); ?></h2>
                <p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentythirteen' ); ?></p>
                <?php get_search_form(); ?>
            </div>
        </div>
    </div>
</div>
<?php
get_sidebar();
get_footer();

注意事项

  • 上传404.php文件后，可通过访问不存在的URL（如http://example.com/fred.php）测试404页面功能。
  • 自定义文本和样式以优化404页面外观和用户体验。
📄 原文内容

A 404 page is important to add into your theme in case a user stumbles upon a page that doesn’t exist or hasn’t been created yet. It is also important that your 404 page gives your visitors a way to arrive at the right place.

These next few steps will help you build a useful 404 page for your WordPress theme.

Creating the 404.php file

As the 404.php file is used on a page not found error, the first step is to create a file named 404.php and add it to your WordPress theme folder.

Often times a great starting point for your 404.php is your index.php

Add a file header

To use your theme’s header.php file, open your 404.php file. At the top, add a comment describing what the file is and make sure you include your theme’s header.

For example:

/**
 * The template for displaying 404 pages (Not Found)
 */
get_header();

Adding the body to your 404 Page

To make the 404 page functional you have to add the body content to your template:

Example:

<div id="primary" class="content-area">
		<div id="content" class="site-content" role="main">

			<header class="page-header">
				<h1 class="page-title"><?php _e( 'Not Found', 'twentythirteen' ); ?></h1>
			</header>

			<div class="page-wrapper">
				<div class="page-content">
					<h2><?php _e( 'This is somewhat embarrassing, isn’t it?', 'twentythirteen' ); ?></h2>
					<p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentythirteen' ); ?></p>

					<?php get_search_form(); ?>
				</div><!-- .page-content -->
			</div><!-- .page-wrapper -->

		</div><!-- #content -->
	</div><!-- #primary -->

This example is from the Twenty Thirteen theme that comes with WordPress. This adds some text and a search form in the 404 page.

You can to add your own text to make your 404 page look better.

Adding the footer and sidebar.

The final step when creating a 404 page is to add the footer. You may also add a sidebar if you want.

Example:

get_sidebar();
get_footer();

Now you have a functional 404 page with a search form and some text in case a user stumbles upon the wrong page. Once you make sure the 404.php has been uploaded, you can test your 404 page. Just type a URL address for your website that doesn’t exist. You can try something like http://example.com/fred.php. This is sure to result in a 404 error unless you actually have a PHP file called fred.php<code>.