如何在 WordPress 中編輯 404 頁面（自定義指南）| WP愛好者

每個內容創建者和網站管理員都知道小細節很重要，互聯網上沒有第二印象。 漂亮的配色方案、出色的動畫效果或吸引人的 404 頁面都是決定用戶體驗成敗的細節。

404 頁面是描述未找到頁面時的情況的技術表達。 例如，可能是因為用戶在瀏覽器選項卡中輸入了錯誤的 URL，或者該網頁不再在線。

在以下段落中，您將學習如何在 WordPress 中編輯 404 頁面。 有吸引力的 404 頁面是克服尷尬時刻的最佳解決方案。 一個出色的 404 頁面不會讓網站訪問者失望，而是有助於更好地展示您的品牌形象。

什麼是 404 頁面

您單擊鏈接或在瀏覽器選項卡中輸入 URL 地址。 接下來，瀏覽器開始從託管您要訪問的網站的服務器請求數據。 這是互聯網瀏覽的基本解釋。 瀏覽器和服務器之間的信息交換包括一些狀態碼。 此外，還有描述網頁重定向、客戶端或服務器錯誤或信息目的的狀態。

所有帶有4XX形式的狀態代碼都與客戶端錯誤有關。 例如，403 Forbidden 是當服務器理解瀏覽器的請求但拒絕提供數據時。 到目前為止，404 頁面是最著名的狀態碼。 當您單擊損壞的鏈接、輸入錯誤的 URL 驅動到不存在的網頁時，或者您請求的資源不存在時，您會得到一個 404 頁面。

即使是重要的網站，如大型雜誌新聞或訪問量很大的商店，也可能包含 404 頁面錯誤。 當然，這是不可避免的，但你應該知道如何度過尷尬的境地。 因此，如果您盡一切可能為您的網站創建一個好看的 404 錯誤頁面，這將有所幫助。

一個好的 404 頁面的剖析

一些網站通過在具有酷 404 頁面的列表中提及來獲得反向鏈接和公眾認可。 網站訪問者欣賞 404 頁面上的優秀設計或幽默信息。 這應該讓您相信，美觀的 404 錯誤頁面是您的在線業務的首要任務。 這是一個好的 404 頁面應該包括的內容：

●錯誤信息——用戶應該從他們登陸 404 頁面的那一刻起就意識到問題。 說清楚，讓每個人都明白。

●指向您的內容的鏈接——您不希望用戶放棄您的網站。 為他們提供相關內容的鏈接。 無論是您最好的內容還是與丟失頁面相關的內容，這完全取決於您。 重要的是讓它們留在您的網站上。

●道歉–讓人們知道您對給他們帶來的不便感到抱歉。 盡可能使用幽默——這是鼓勵他們給您的網站第二次機會的最佳方法。

●良好的設計——人們在進入 404 頁面時會感到失望並且往往反應過度。 除了引人入勝的內容外，令人驚嘆的設計可能會改變他們的想法。 盡力製作出色的 404 頁面。

如何在 WordPress 中編輯 404 頁面

幸運的是，我們有多種選項可以在 WordPress 中編輯 404 頁面。 最有經驗的用戶可能會去編輯 404.php 文件。 這是負責顯示 404 錯誤頁面的文件。 喜歡使用 Elementor 等頁面構建器的 Web 管理員可以創建 404 頁面。 最後，一些用於製作 404 頁面的插件可供缺乏編碼技能的人使用。 讓我們剖析在 WordPress 中創建和編輯 404 頁面的所有方法。

通過 FTP 客戶端編輯 404 頁面

一個好的經驗法則是在編輯代碼之前執行站點的備份副本。 永遠不要跳過這一步——在大多數情況下，您不需要站點備份，但如果沒有做好準備，就會發生壞事。 所以做備份放心！

假設您執行了完整的站點備份，並且準備好深入研究此事。 使用您選擇的 FTP 客戶端並連接到站點 localhost。 搜索一個名為 404.php 的文件——它是負責顯示 404 錯誤網頁的文件。 通常，WordPress 主題有一個專用的 404.php 文件，但有些人可能會錯過這個文件。 仔細檢查您的主題代碼是否包含 404.php 文件。 如果您的主題沒有 404.php 文件，您將不得不構建一個。 創建一個新文件並複制以下代碼行：

404頁面模板

<?php /** * The template for displaying 404 pages (Not Found) * * @package WordPress * @subpackage Twenty_Thirteen * @since Twenty Thirteen 1.0 */ get_header(); ?> <div class="content-area"> <div 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 --> <?php get_footer(); ?>

來源：在 WordPress Codex 上創建錯誤 404 頁面

這是 404 Page of 23 主題背後的代碼 - 這是一個適合編輯和用於您的項目的基本頁面。 當然，您可以查看其他默認的 WordPress 主題並檢查它們的 404 頁面。 二十三主題的404頁面調用了你網站的頁眉和頁腳，所以頁面符合你網站的風格。 無論您的網站看起來如何，404 錯誤頁面都會有類似的設計。 但是，您必須調整此頁面上顯示的內容。 在這個階段，您的內容創建者的才能介入。

或者，您可以編輯 404.php 文件以顯示在您的站點上發布的內容。 選項是無窮無盡的，所以讓我們看看增強 404 頁面錯誤的一些潛在方式。

• 顯示最近七篇文章的標題——你所要做的就是把這段代碼粘貼到 404.php 文件中：

 <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 7, 'format' => 'custom', 'before' => '<span class="my-post-title">', 'after' => '</span>, ' ) ); ?>

• 顯示隨機七個帖子的標題粘貼以下代碼以顯示七個隨機帖子：

 <ul> <?php $rand_posts = get_posts( array( 'posts_per_page' => 5, 'orderby' => 'rand' ) ); if ( $rand_posts ) { foreach ( $rand_posts as $post ) : setup_postdata( $post ); ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endforeach; wp_reset_postdata(); } ?> </ul>

添加您的徽標或有趣的圖像（貓和狗總是有效），讓觀眾微笑並給您第二次機會。 接下來，在完成編輯工作後測試 404 頁面。 要顯示您的 404 頁面，請在瀏覽器欄中輸入您的站點地址，並在其後添加一個隨機的字母字符串。 結果應該是這樣的：

 https://example.com/dfdfddfd

如果它不起作用，那是因為服務器找不到您的自定義 404.php 文件。 在這種情況下，您應該轉到站點 .htaccess 文件並粘貼以下代碼行：

錯誤文檔 404 /index.php?error=404

重要提示：如果您編輯新的或最近啟動的網站，它可能沒有 .htaccess 文件。 這不是一個大問題 - 更改您網站的永久鏈接並保存您的操作。 然後，在此之後立即恢復為您首選的永久鏈接格式。 這樣，您將生成 .htaccess 文件。

通過主題編輯器編輯 404 頁面（不推薦）

大量與在 WordPress 中編輯 404 頁面相關的文章提到主題編輯器是一種可行的解決方案。 它不是！ 雖然直接從 WordPress 管理儀表板編輯站點代碼既方便又直接，但它很危險，最終可能會失敗。 更不用說，在網站在線並且每個人都可以訪問時編輯網站一點也不專業。 此外，一旦您更新主題，您的編輯就會消失（除非您使用子主題）。

通過頁面構建器編輯 404 頁面

這種方法安全、簡單、有效。 您可能熟悉 Elementor、Divi Builder、Beaver Builder、SeedProd 或 Themify Builder 等頁面構建器。 你選擇哪個無關緊要，只要你能很好地掌握它。 這些構建器讓您無需編寫任何代碼即可創建出色的 404 頁面。 如果您擔心將代碼片段粘貼到您的站點文件中，這是最好的解決方案。

查看您最喜歡的頁面構建器的博客和文檔，您很可能會找到解釋如何創建 404 頁面的教程。 此外，一些頁面構建器有專門的 404 頁面模板。 選擇一個模板並對其進行個性化以匹配您的品牌。

404頁WordPress插件

您沒有太多選擇來使用專用插件創建 404 頁面。 但是，一些插件值得您關注。 他們的資本優勢是您不必編寫代碼來創建和編輯 404 頁面。 這些插件簡單、有效且輕量級。

404頁 

您可能會認為您必須是一名編碼人員才能創建一個好的 404 錯誤頁面。 多虧了這個插件，每個人都可以構思一個有吸引力的 404 錯誤頁面。 此外，404page 插件並不像頁面構建器那樣複雜。 你專注於你的最終產品——一個好的 404 錯誤頁面。

安裝並激活插件。 接下來，創建一個 404 頁面，就像您在網站上創建其他頁面一樣。 在您的 WordPress 管理儀表板中，轉到外觀 > 404 錯誤頁面，然後選擇您剛剛構建的頁面作為您的站點自定義 404 錯誤頁面。

該插件不允許重定向網頁； 它只是告訴搜索機器人該網頁丟失了。 404page是一個開發者的個人項目，所以這個插件背後沒有代理。 考慮到該插件有 100,000 次活躍安裝和幾乎完美的評分 - 4.9 星（滿分 5 星）。在這種情況下，插件開發人員值得我們讚賞！

所有 404 重定向到主頁和損壞的圖像重定向 

該插件的名稱不是很令人印象深刻，但它具有很強的暗示性。 該插件處理 404 頁面錯誤的方式與之前的替代方式不同。 這個插件不是用精心設計的 404 頁面來取悅訪問者，而是將所有 404 錯誤重定向到主頁或其他網頁。 該插件的最大優勢是您可以控製網站上的損壞鏈接。 此外，您可以使用此插件重定向用戶。 例如，不要讓人們訪問未更新的博客文章，而是使用此插件將他們驅動到更新的版本。

Colorlib 404 定制器 

該插件使用簡單，真正幫助您創建引人入勝的 404 頁面。 它帶有專業製作的 404 模板，您可以根據自己的需要進行自定義。 Colorlib 404 Customizer 插件允許插入社交媒體按鈕、更改背景顏色或圖像以及配置文本標題。 更高級的用戶可以添加自定義 CSS 代碼。 該插件是開源的，因此您可以為改進插件做出貢獻。

使用頁面構建器或通過您的主題進行。

如果您已經使用頁面構建器，則您已經可以選擇通過它自定義 404。 幾乎每個頁面構建器都允許您編輯 404 頁面。 以下是我們確信您可以使用的插件列表：

● 微風

● 元素

● 海狸生成器

● Divi Builder

● 網站來源

如果您使用的是 OceanWP、GeneratePress 或 Astra 等主題，您可以通過它們的主題選項來實現。 如果您導入演示內容，您將獲得一個外觀精美的 404 頁面。 導入演示內容和使用預先構建的設計的唯一缺點是您的網站或多或少看起來與演示完全相同。 以這個網站和 Astra 演示為例。 瀏覽過 Astra 的初始網站庫的每個人都會很快意識到網站所有者並不是自己創建的。 這可能會損害用戶對您網站的信任程度。

從好的方面來說，Astra、OceanWP 和其他擁有 500.000 多用戶的主題每個月都會擴展他們的初始站點庫。

交給你

您現在對如何在 WordPress 中編輯 404 頁面有了清晰的認識。 有很多解決方案可以做到這一點，您應該選擇適合您的技能和需求的一種。 重要的是有一個令人興奮的 404 錯誤頁面來取悅您的觀眾。 您用於設計和實施該 404 頁面的方法和工具與您的客戶無關。 您沒有任何藉口缺少出色的 404 錯誤頁面！ 轉到繪圖板並開始構建自定義錯誤頁面！