Create an Editable 404 Page Message
Posted on May 3, 2013
WordPress provides a specific template, ‘404.php’ for displaying a ‘page not found’ type of message and the typical examples for this template have hard coded messages instead of editable content from a WordPress page or post. While this is fine for basic error messages it does not provide a convenient way to update the content later on, and does not allow for a non technical person to update the message either.
So, it occurred to me that it might be useful to have an ‘editable’ 404 page so I or a client could easily alter the page not found message using the text editor in WordPress. You may find that you need to update the page not found message with new contact information at a later point, add helpful links within the copy, or perhaps add a link to a recently created sitemap.
From a technical point of view, one approach to supporting an editable 404 page, is to create a WordPress page and then use the WordPress API to load the data from this page into the 404.php template. There are two parts to this, one is to create the page containing the message and the other is to add code to the 404.php template to display the message.
First you need to create a WordPress page, with a title and content. The content of this page is up to you but it is always helpful to review other articles on what wording or links you might include in the message.
For the coding portion of this feature, we will need to know the numeric ID (post id) of the page we created. While you are still logged into the backend, you can find the post ID within the url of your recently created page. Make a note of the number assigned to the post value in the query string portion of the url.
Next we add code to the 404.php template to get the content from our page and display it within the template. Since we are loading data from another post we will need to do a few things to set up the $post object so we can use the convenient WordPress template tags, such as the_title and the_content within the 404.php template.
The basic idea is to pass the page ID to the get_post function, then call the setup_postdata function so that we can then use the template tags. Note that setup_postdata requires the global variable $post to properly set up these functions. If you do not pass the actual $post global variable to setup_postdata then you may not be able to use all of the template tags.
First you will establish the global variable $post. At this point the $post variable does not contain any data but you still need its global scope for the setup_postdata function. Next you get the page data for your page not found page by passing the page ID you noted above to the get_post function and assign this data to the global $post variable. Finally, you pass the $post variable to the setup_posts function.
// establish the global $post varaiable
global $post;
// id of 'page not found' wordpress page
$page_id = 21;
// get the page data, must assign to the global $post variable
$post = get_post($page_id);
// set up the global $post object
setup_postdata($post);
Now that you have set up the post data you can use the template tags to print the content from the page into the template. To be on the safe side, you may want to have an if then statement that displays a hard coded message if your WordPress ‘Page not found’ page is deleted or there is some other problem loading the page data.
Instead of using have_posts to check for the existence of the post, you can check to see if the $post object is empty. If it is not empty then use the template tags to build the page otherwise fall back to printing a hard coded message.
// page exists, print contents of the custom page
if(!empty($post)){
the_title( '
', '
' ); // format title
the_content(); // print content
// could not find the WordPress post,
// display a hard coded message instead
} else {
print 'The page you are looking for does not exist.';
}
