CINXE.COM

<!DOCTYPE html> <html lang="en-US" prefix="og: http://ogp.me/ns#"> <head><script type="text/javascript" src="https://web-static.archive.org/_static/js/bundle-playback.js?v=7YQSqjSh" charset="utf-8"></script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("http://wptricks.net:80/create-effective-404-page-wordpress/","20171017032627","https://web.archive.org/","web","https://web-static.archive.org/_static/", "1508210787"); </script> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/banner-styles.css?v=p7PEIJWi" /> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/iconochive.css?v=3PDvdIFv" />  <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="pingback" href="http://wptricks.net/xmlrpc.php"> <title>How to Create an effective 404 Page in WordPress - WP Tricks</title>  <meta name="robots" content="noodp"/> <link rel="canonical" href="https://web.archive.org/web/20171017032627/http://wptricks.net/create-effective-404-page-wordpress/"/> <meta property="og:locale" content="en_US"/> <meta property="og:type" content="article"/> <meta property="og:title" content="How to Create an effective 404 Page in WordPress - WP Tricks"/> <meta property="og:description" content="The page you often see when clicking on any link saying “404 Error” or “Page not Found” or “Page cannot be displayed” etc etc. is basically a 404 Error Page. Its like a dead-end for your user. Which can lead to exit of Website Surfing and obviously no one wants to see his visitors leave …"/> <meta property="og:url" content="https://web.archive.org/web/20171017032627/http://wptricks.net/create-effective-404-page-wordpress/"/> <meta property="og:site_name" content="WP Tricks"/> <meta property="article:section" content="WordPress Tips"/> <meta property="article:published_time" content="2014-02-26T10:22:52+00:00"/> <meta property="article:modified_time" content="2014-02-20T10:23:37+00:00"/> <meta property="og:updated_time" content="2014-02-20T10:23:37+00:00"/>  <link rel="alternate" type="application/rss+xml" title="WP Tricks » Feed" href="https://web.archive.org/web/20171017032627/http://wptricks.net/feed/"/> <link rel="alternate" type="application/rss+xml" title="WP Tricks » Comments Feed" href="https://web.archive.org/web/20171017032627/http://wptricks.net/comments/feed/"/> <script type="text/javascript"> window._wpemojiSettings = {"baseUrl":"https:\/\/web.archive.org\/web\/20171017032627\/https:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"https:\/\/web.archive.org\/web\/20171017032627\/http:\/\/wptricks.net\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.5.10"}}; !function(a,b,c){function d(a){var c,d,e,f=b.createElement("canvas"),g=f.getContext&&f.getContext("2d"),h=String.fromCharCode;if(!g||!g.fillText)return!1;switch(g.textBaseline="top",g.font="600 32px Arial",a){case"flag":return g.fillText(h(55356,56806,55356,56826),0,0),f.toDataURL().length>3e3;case"diversity":return g.fillText(h(55356,57221),0,0),c=g.getImageData(16,16,1,1).data,d=c[0]+","+c[1]+","+c[2]+","+c[3],g.fillText(h(55356,57221,55356,57343),0,0),c=g.getImageData(16,16,1,1).data,e=c[0]+","+c[1]+","+c[2]+","+c[3],d!==e;case"simple":return g.fillText(h(55357,56835),0,0),0!==g.getImageData(16,16,1,1).data[0];case"unicode8":return g.fillText(h(55356,57135),0,0),0!==g.getImageData(16,16,1,1).data[0]}return!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g,h,i;for(i=Array("simple","flag","unicode8","diversity"),c.supports={everything:!0,everythingExceptFlag:!0},h=0;h<i.length;h++)c.supports[i[h]]=d(i[h]),c.supports.everything=c.supports.everything&&c.supports[i[h]],"flag"!==i[h]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[i[h]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings); </script> <style type="text/css"> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 .07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style> <link rel="stylesheet" id="coller-style-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/style.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="coller-title-font-css" href="//web.archive.org/web/20171017032627cs_/http://fonts.googleapis.com/css?family=Lato%3A100%2C300%2C400%2C700&ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="font-awesome-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/font-awesome/css/font-awesome.min.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="nivo-slider-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/css/nivo-slider.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="nivo-skin-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/css/nivo-default/default.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="bootstrap-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/bootstrap/css/bootstrap.min.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="hover-style-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/css/hover.min.css?ver=4.5.10" type="text/css" media="all"/> <link rel="stylesheet" id="coller-main-theme-style-css" href="https://web.archive.org/web/20171017032627cs_/http://wptricks.net/wp-content/themes/coller/assets/css/main.css?ver=4.5.10" type="text/css" media="all"/> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-includes/js/jquery/jquery.js?ver=1.12.4"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-content/themes/coller/js/custom.js?ver=4.5.10"></script> <link rel="https://api.w.org/" href="http://wptricks.net/wp-json/"/> <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://wptricks.net/xmlrpc.php?rsd"/> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://wptricks.net/wp-includes/wlwmanifest.xml"/> <meta name="generator" content="WordPress 4.5.10"/> <link rel="shortlink" href="https://web.archive.org/web/20171017032627/http://wptricks.net/?p=90"/> <link rel="alternate" type="application/json+oembed" href="https://web.archive.org/web/20171017032627/http://wptricks.net/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fwptricks.net%2Fcreate-effective-404-page-wordpress%2F"/> <link rel="alternate" type="text/xml+oembed" href="https://web.archive.org/web/20171017032627/http://wptricks.net/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fwptricks.net%2Fcreate-effective-404-page-wordpress%2F&format=xml"/> <style id="custom-css-mods">#masthead #site-logo img { transform-origin: left; }.site-description { color: #777; }.mega-container { background: #f7f7f7; }</style> <style> #masthead { background-image: url(https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/assets/images/header.jpg); background-size: cover; background-position-x: center; background-repeat: no-repeat; } </style> </head> <body class="single single-post postid-90 single-format-standard"> <div id="page" class="hfeed site"> <a class="skip-link screen-reader-text" href="#content">Skip to content</a> <div id="jumbosearch"> <span class="fa fa-remove closeicon"></span> <div class="form"> <form role="search" method="get" class="search-form" action="https://web.archive.org/web/20171017032627/http://wptricks.net/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="s"/> </label> <input type="submit" class="search-submit" value="Search"/> </form> </div> </div> <header id="masthead" class="site-header" role="banner"> <div class="layer"> <div class="container"> <div class="site-branding"> <div id="text-title-desc"> <h1 class="site-title title-font"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/" rel="home">WP Tricks</a></h1>  </div> </div> <div class="social-icons"> </div> </div> </div> </header> <nav id="site-navigation" class="main-navigation front" role="navigation"> <div class="container"> <div class="menu"><ul><li><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/">Home</a></li></ul></div> </div> </nav> <div class="mega-container"> <div id="content" class="site-content container"> <div id="primary-mono" class="content-area col-md-8"> <main id="main" class="site-main" role="main"> <article id="post-90" class="post-90 post type-post status-publish format-standard hentry category-tips"> <header class="entry-header"> <h1 class="entry-title title-font">How to Create an effective 404 Page in WordPress</h1> <div class="entry-meta"> <span class="posted-on">Posted on <a href="https://web.archive.org/web/20171017032627/http://wptricks.net/create-effective-404-page-wordpress/" rel="bookmark"><time class="entry-date published" datetime="2014-02-26T10:22:52+00:00">February 26, 2014</time><time class="updated" datetime="2014-02-20T10:23:37+00:00">February 20, 2014</time></a></span><span class="byline"> by <span class="author vcard"><a class="url fn n" href="https://web.archive.org/web/20171017032627/http://wptricks.net/author/Anna/">Anna</a></span></span> </div> </header> <div id="featured-image"> </div> <div class="entry-content"> <div class="adsxpls" id="adsxpls1" style="padding:7px; float: right; padding-right: 0; margin: 0px;"><ins class="adsbygoogle" id="adsgoogle1" style="display:inline-block;width:300px;height:250px" data-ad-client="ca-pub-1976096086841061" data-ad-slot=""></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div><p>The page you often see when clicking on any link saying “<strong>404 Error</strong>” or “<strong>Page not Found</strong>” or “<strong>Page cannot be displayed</strong>” etc etc. is basically a 404 Error Page. Its like a dead-end for your user. Which can lead to exit of Website Surfing and obviously no one wants to see his visitors leave like that. So here are some tips to get the best out of the 404 Page.</p> <p>Giving useful links and information on a 404 page can help your user stay and go more around your Website or Blog. You can check out mine here.</p> <p>Showing a Search box, some recent Post or list of archives is a good way to let user stay on the Blog more.</p> <p>Create a 404.php page in your theme folder if you don’t have already. You can use any styles and HTML tags you want, to fit your needs. But try using the same design structure that of Blog, so the page looks like its also part of the Blog.</p> <p>Make sure you have these basic PHP Codes in your 404 file. The easy way is to follow The Custom Page Template Tutorial to create a 404 page and insert content as u like it.<br/> <code></code></p> <pre><?php get_header(); ?></pre> <pre><?php get_sidebar(); ?></pre> <pre><?php get_footer(); ?></pre> <h3>Some useful tags you may want to use:</h3> <p>Here are some of the tags that you can use:</p> <h4><strong>Display Archive by Months:</strong></h4> <blockquote><p><?php wp_get_archives(‘type=monthly’); ?></p></blockquote> <p>This code will display archive by months, but it will list all months. So it might become a mess if you have a blog that is three years old.</p> <h4><strong>Display lis</strong><strong>t of Categories</strong></h4> <blockquote><p><?php wp_list_cats(); ?></p></blockquote> <p>This code will list all categories on your blog. Ofcoures you can style them however using list tags or others. To exclude any category such as “Uncategorized” follow this tutorial</p> <h4><strong>Display Mo</strong><strong>st used Tags</strong></h4> <blockquote><p><?php wp_tag_cloud(‘smallest=8&largest=12&unit=pt&number=30&format=list&order=RAND’); ?></p></blockquote> <p>This will show the most used tags in a cloud form.</p> <h4><strong>Display Rece</strong><strong>nt Posts</strong></h4> <blockquote><p><?php get_archives(‘postbypost’, ’17′, ‘custom’, ‘<li>’, ‘</li>’); ?></p></blockquote> <p>This brings the most recent Posts written on your Blog.</p> <p>There are too many tags you can use but here are some most important or should say finest ones !</p>  </div> <footer class="entry-footer"> <span class="cat-links">Posted in <a href="https://web.archive.org/web/20171017032627/http://wptricks.net/tips/" rel="category tag">WordPress Tips</a></span> </footer> </article> </main> </div> <div id="secondary" class="widget-area col-md-4" role="complementary"> <aside id="aeopt-2" class="widget adsense_plugin_explosion_Widget"><ins class="adsbygoogle" id="adsgoogle0" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-1976096086841061" data-ad-slot=""></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></aside><aside id="search-2" class="widget widget_search"><form role="search" method="get" class="search-form" action="https://web.archive.org/web/20171017032627/http://wptricks.net/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="s"/> </label> <input type="submit" class="search-submit" value="Search"/> </form></aside><aside id="nav_menu-2" class="widget widget_nav_menu"><h1 class="widget-title title-font">Recommended Blogs</h1><div class="menu-friends-container"><ul id="menu-friends" class="menu"><li id="menu-item-110" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-110"><a href="https://web.archive.org/web/20171017032627/http://moz.com/">Moz</a></li> <li id="menu-item-109" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-109"><a href="https://web.archive.org/web/20171017032627/http://makeawebsitehub.com/how-to-start-a-blog/">How to Start a Blog Guide</a></li> <li id="menu-item-111" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-111"><a href="https://web.archive.org/web/20171017032627/http://speckyboy.com/">Specky Boy</a></li> <li id="menu-item-112" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-112"><a href="https://web.archive.org/web/20171017032627/http://wpbeginner.com/">WP Beginner</a></li> </ul></div></aside><aside id="coller_rp-2" class="widget widget_coller_rp"><h1 class="widget-title title-font">Latest Articles</h1> <ul class="rp"> <li class="rp-item"> <div class="rp-thumb"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/monster-wordpress-cheat-sheet/"><img src="https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/images/nthumb.png"></a></div> <div class="rp-title"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/monster-wordpress-cheat-sheet/">Monster WordPress Cheat Sheet</a></div> <div class="rp-date">Aug 18, 2015</div> </li> <li class="rp-item"> <div class="rp-thumb"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/replace-content-wordpress-using-sql/"><img src="https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/images/nthumb.png"></a></div> <div class="rp-title"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/replace-content-wordpress-using-sql/">Replace Content in Your WordPress using SQL</a></div> <div class="rp-date">Jun 10, 2014</div> </li> <li class="rp-item"> <div class="rp-thumb"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/big-compilation-wordpress-code/"><img src="https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/images/nthumb.png"></a></div> <div class="rp-title"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/big-compilation-wordpress-code/">A Big Compilation of WordPress Code</a></div> <div class="rp-date">Mar 4, 2014</div> </li> <li class="rp-item"> <div class="rp-thumb"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/create-effective-404-page-wordpress/"><img src="https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/images/nthumb.png"></a></div> <div class="rp-title"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/create-effective-404-page-wordpress/">How to Create an effective 404 Page in WordPress</a></div> <div class="rp-date">Feb 26, 2014</div> </li> <li class="rp-item"> <div class="rp-thumb"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/exclude-categories-navigation/"><img src="https://web.archive.org/web/20171017032627im_/http://wptricks.net/wp-content/themes/coller/images/nthumb.png"></a></div> <div class="rp-title"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/exclude-categories-navigation/">How to exclude Categories from Navigation in WordPress ?</a></div> <div class="rp-date">Feb 24, 2014</div> </li> </ul> </aside><aside id="categories-2" class="widget widget_categories"><h1 class="widget-title title-font">Categories</h1> <ul> <li class="cat-item cat-item-1"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/uncategorized/">Uncategorized</a> </li> <li class="cat-item cat-item-3"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/tips/">WordPress Tips</a> </li> <li class="cat-item cat-item-2"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/tricks/">WordPress Tricks</a> </li> <li class="cat-item cat-item-12"><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/themes/">WP Themes</a> </li> </ul> </aside><aside id="aeopt-3" class="widget adsense_plugin_explosion_Widget"></aside></div> </div> </div> <footer id="colophon" class="site-footer" role="contentinfo"> <div class="container"> <div class="site-info"> © 2017 WP Tricks. All Rights Reserved. <span class="sep"></span> Coller Theme by <a href="https://web.archive.org/web/20171017032627/http://inkhive.com/" rel="nofollow">Rohit</a>. </div> <div id="footer-menu"> <div class="menu"><ul><li><a href="https://web.archive.org/web/20171017032627/http://wptricks.net/">Home</a></li></ul></div> </div> </div> </footer> </div> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-content/themes/coller/js/navigation.js?ver=20120206"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-content/themes/coller/js/external.js?ver=20120206"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-content/themes/coller/js/skip-link-focus-fix.js?ver=20130115"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://wptricks.net/wp-includes/js/wp-embed.min.js?ver=4.5.10"></script> <script type="text/javascript" src="https://web.archive.org/web/20171017032627js_/http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?ver=4.5.10"></script> </body> </html>