{"id":171,"date":"2018-09-03T11:51:38","date_gmt":"2018-09-03T11:51:38","guid":{"rendered":"https:\/\/meetanshi.com\/blog\/2018\/09\/03\/customize-404-page-not-found-in-magento-2\/"},"modified":"2025-07-17T15:54:04","modified_gmt":"2025-07-17T10:24:04","slug":"customize-404-page-not-found-in-magento-2","status":"publish","type":"post","link":"https:\/\/meetanshi.com\/blog\/customize-404-page-not-found-in-magento-2\/","title":{"rendered":"How To Customize 404 Page Not Found in Magento 2"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">404 page is the most common web error caused by broken links or URL typo. Whenever users land to a 404 error page, there are chances that they may leave the store. To grab their attention and make the page user-friendly, you should customize the 404 page which may display some additional information or provide links to users to get back to the track.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Having a good and user-friendly&nbsp;404 page content is as important as other pages in your Magento 2 store as it can benefit you with the better sales opportunity.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Magento 2, by default, displays the 404 Error Page as below:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/Default-404-Page-Not-Found.png\" alt=\"Default 404 Page Not Found\" class=\"wp-image-3398\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The Magento 2 backend allows customizing the page and its content. It allows to deliver the message that you want to display that might convince the users to try again or click the link provided on the screen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Customizing the 404 error page gives one more chance to not lose a potential customer because a particular page is not active or does not exist!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Here, I\u2019ll show the steps&nbsp;<em><strong>to customize 404 page not found in Magento 2.&nbsp;<\/strong><\/em>Follow them and get a customized 404 error page to boost the flow of sales. Along with this you can also once have a look on some of the&nbsp;<a href=\"https:\/\/meetanshi.com\/blog\/best-404-page-examples\/\">creative 404 pages examples<\/a>&nbsp;which may be helpful to you<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Steps to Customize 404 Page Not Found in Magento 2:<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Login to admin and navigate to&nbsp;<em><em><strong>Content &gt; Pages.<\/strong><\/em><\/em><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2019\/12\/1_Path.png\" alt=\"1_Path\" class=\"wp-image-7085\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Select the&nbsp;<em><strong>Edit<\/strong><\/em>&nbsp;action of the 404 page Not Find from the grid.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/2_404-page-in-the-list.png\" alt=\"2_404-page-in-the-list\" class=\"wp-image-3400\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">You\u2019ll see the below screen where we\u2019ll be doing all the customization.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/3_page-tabs.png\" alt=\"3_page-tabs\" class=\"wp-image-3401\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">As shown below, input the&nbsp;<strong>Page title<\/strong>&nbsp;you want.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/4_page-title.png\" alt=\"4_page-title\" class=\"wp-image-3402\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Moving on to the Content, you\u2019ll land upon the following screen where you can input your content.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/5_page-content.png\" alt=\"5_page-content\" class=\"wp-image-3403\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Customize the Content Heading and the Content for the 404 Error Page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/6_customize-content.png\" alt=\"6_customize-content\" class=\"wp-image-3404\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">In the Design section, select the layout and update XML.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/7_page-design.png\" alt=\"7_page-design\" class=\"wp-image-3405\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Enable&nbsp;<\/strong>the page and&nbsp;<strong>Save<\/strong>&nbsp;the Configuration.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/8_enabling-404-page.png\" alt=\"8_enabling-404-page\" class=\"wp-image-3406\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">After clearing the cache, the output is as below:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2018\/08\/9_customized-magento-2-404-page.png\" alt=\"9_customized-magento-2-404-page\" class=\"wp-image-3407\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">You may add product links, widgets, any other useful links of your store or input any message. Such elements help to engage the users or land them to a different page to boost sales.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Hopefully, the post is helpful to create a 404 error page in your store. You can also&nbsp;<a href=\"https:\/\/meetanshi.com\/blog\/customize-maintenance-mode-page-in-magento-2\/\">customize Maintenance Mode Page in Magento 2<\/a>&nbsp;if bored of \u2018Server Temporarily Unavailable\u2019 maintenance page in your Magento 2 store.<a href=\"https:\/\/meetanshi.com\/blog\/sqlstate42s22-column-not-found-1054-unknown-column-in-magento-2-admin-grid-massaction\/\">Fix SQLSTATE[42S22]: Column not found<\/a>&nbsp;in admin grid mass action, it is one of the most common errors that is displayed when a certain column is not found in the database.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Thank You!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>404 page is the most common web error caused by broken links or URL typo. Whenever users land to a 404 error page, there are&#8230;<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[34],"tags":[],"class_list":["post-171","post","type-post","status-publish","format-standard","hentry","category-magento"],"acf":[],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/171","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=171"}],"version-history":[{"count":2,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/171\/revisions"}],"predecessor-version":[{"id":15609,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/171\/revisions\/15609"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=171"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=171"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=171"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}