如何在WordPress中改善404頁面模板


404錯誤不利於用戶體驗。 我們向您展示瞭如何在您的網站上獲取有關404錯誤的電子郵件警報,以便您快速修復它們。 在本文中,我們將向您展示如何在WordPress中改進404頁面模板,以便您可以創建實際上對用戶有幫助的更有用的404頁面。

大多數WordPress 404頁面的外觀如何?

404頁面通常是大多數網站上最被忽視的頁面。 通常,很多WordPress主題404頁面如下所示:

二十四404頁

WordPress中的404頁面由名為404.php的模板文件處理。

如果您的配置確實搞砸了,那麼404頁面將如下所示:

瀏覽器處理的404錯誤

以上404頁都不是真正有用的。

當用戶登陸404頁面時,他們已經感到沮喪。 為什麼? 因為他們找不到他們想要的東西。

您需要幫助用戶找到正確的頁面。 您可以通過正確地傳達錯誤並為他們提供適當的操作方法(即下一步做什麼)來幫助改善這種體驗。

可以通過向他們顯示他們可以訪問的網站的其他部分,為他們提供聯繫方式等來完成此操作。

如何在WordPress中創建自定義404頁面

我們需要做的第一件事是從創建自定義404頁面模板開始。 這可以通過在WordPress主題中編輯404.php文件來完成。

如果您直接編輯主題,那麼我們強烈建議您至少備份WordPress主題。

為了使您的404頁更有用,我們將向您展示如何添加有用的元素,例如熱門帖子,評論最多的帖子,最新帖子,日期檔案,所有類別的列表等。

這將使新用戶可以快速瀏覽您所提供的功能。

在404頁上顯示最受歡迎的帖子

我們將使用最好的WordPress熱門帖子插件之一在404頁面上顯示熱門帖子。

您需要做的第一件事是在您的網站上安裝並激活WordPress Popular Posts插件。 激活後,您需要將此模板標記添加到要顯示熱門帖子的404.php文件中。


在404頁上顯示評論最多的帖子

評論最多的帖子部分還依賴於我們在上一步中激活的熱門帖子插件。 只需在您要顯示評論最多的帖子的位置添加此模板標籤即可。


您還可以查看有關如何在WordPress中顯示評論最多的帖子的指南。

在404頁上顯示最近的帖子

有多種方法可以顯示WordPress中的最新帖子。 最簡單的方法是在404模板中添加此模板標記,以顯示您最近的帖子。

 'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => '', 'after' => '
' ) ); ?>

在404頁上顯示隨機帖子

如果要在WordPress中顯示隨機的帖子列表,則只需在404模板中添加此代碼,即可在其中顯示網站的隨機列表。

  • " title="">

使用壓縮檔案添加每月檔案

如果您查看WPBeginner 404頁面,則會注意到我們正在使用插件Compact Archives顯示我們的每月存檔列表。 請注意,我們已經採用了該插件,現在正在對其進行維護。

安裝並激活該插件Compact Archives插件。 激活插件後,在您的404.php文件中添加以下代碼:

By Date

它將顯示您的每月存檔,如下所示:

使用Compact Archives每行顯示一年的每月存檔

WordPress的示例404模板

這是一個基於默認WordPress主題二十三十三的404模板的404.php示例文件。


	

Check out some of our popular content:

Popular Posts

Most Commented

Recent Posts

'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => '', 'after' => '
' ) ); ?>

將此404模板與“二十三個”中的默認模板進行比較。 您會注意到,在搜​​索表單之後,我們添加了自定義代碼,以顯示熱門,評論最多和最近發布的帖子。 之後,我們添加了一些CSS將其分為幾列。

.col1, .col2, .col3 { 
width:30%;
float:left;
padding:0px 10px 10px 10px;
height:450px;
margin:0px;
}
.col3:after{
clear:both;
}
.col-header { 
background:#220e10;
color:#FFF;
margin:0px;
padding:1px;
text-align:center;
}

最終結果如下所示:

WordPress中修改後的404頁面顯示熱門帖子

我們希望本文能幫助您改善WordPress網站上的404頁面。 隨意使用代碼並嘗試使用不同的模板標籤來滿足您的需求。

您也可以使用此列表作為404設計示例的靈感。

如果您喜歡這篇文章,請訂閱我們的YouTube頻道以獲取更多WordPress視頻。 您也可以在Google+和 推特