如何在WordPress中創建自定義404頁面模板(分3個步驟)

[ad_1]

對於用戶而言,遇到錯誤頁面可能會令人沮喪和困惑。如果您的404頁面模板未正確自定義,則用戶可能會決定離開您的網站。結果,您錯過了參與度和潛在轉化率。

幸運的是,您可以通過創建自定義404頁面來讓用戶知道他們仍然在您的網站上,並將他們定向回到您的內容。

此外,得益於Elementor,您無需任何特殊的技術知識即可執行此操作。

#404錯誤發生,但是自定義#WordPress 404錯誤頁面將錯誤轉化為機會?

點擊鳴叫

在本文中,我們將說明為您的網站創建自定義404頁面的好處。然後,我們將向您展示如何在Elementor中構建一個。讓我們開始吧!

為什麼需要自定義404頁面

404錯誤是伺服器無法找到請求的內容時顯示的頁面。換句話說,當訪問者單擊斷開的鏈接或在您的網站上輸入錯誤的URL時,他們將收到404錯誤。例如,這是我們的404頁面:

ThemeIsle 404錯誤頁面。

如您所見,我們已經定製了404頁面以匹配我們的品牌,並提供了一種返回到我們的有效內容的方法-在這種情況下為搜索表單。

有效的404頁面經過自定義,使人們知道他們在正確的網站上。此外,它還可以提供指向您內容的鏈接,從而可以 提高整體參與度。如果您不對其進行自定義,則訪問者將通過您的活動WordPress主題獲得一個通用頁面:

非定製的404頁面模板。

儘管這個特定的404頁面確實有一個指向其主要網站的鏈接,但是沒有其他方法可以知道它屬於哪個網站。結果,用戶可以簡單地決定關閉窗口並繼續前進。畢竟,如果他們在您的網站上找不到想要的內容,他們可能會在其他地方尋找。

相反,使用我們的404頁面,用戶可以確切地知道他們在哪裡。此外,我們提供了一個搜索欄,可幫助他們將其定向到他們要查找的內容。更不用說,如果您向下滾動我們的示例頁面,您會找到一些鏈接。 我們最受歡迎的內容

在自定義404頁面上包含諸如此類的元素可以幫助您 防止用戶彈跳。此外,您可以增加品牌形象,並提高對受眾的信任和信譽。

如何使用Elementor創建自定義WordPress 404頁面模板
Elementor頁面構建器Elementor頁面構建器

作者: Elementor.com

當前版本:2.7.5

上次更新時間:2019年10月28日

elementor.2.7.5.zip

98%評級 37,842,319下載 WP 4.7+要求

要在WordPress上創建自定義404錯誤頁面模板,您可以使用Elementor的高級版– Elementor Pro

元素 是一個 可視的拖放頁面構建器,這意味著您可以創建完全自定義的設計而無需任何特殊知識。或者,如果您不想從頭開始構建自己的設計, Elementor Pro還包括 您可以根據需要導入和自定義許多預構建的404頁面模板。

首先,您需要同時安裝Elementor和Elementor Pro。然後,按照以下步驟創建您自己的自定義404頁面設計…

1.創建一個新的404頁面模板

首先,您需要創建一個新的Elementor模板。在您的WordPress儀錶板中,轉到模板→主題生成器:

選擇了模板→主題生成器的WordPress管理員。 「 width =」 2100「 height =」 1126

接下來,選擇Single→添加新。這將打開一個頁面,您可以在其中選擇要創建的模板。點擊模板類型下拉菜單,然後選擇單個。然後,導航到「帖子類型」下拉列表並單擊404。

然後,將要求您命名模板。您可以隨意命名,但我們建議您堅持使用「 404頁面」之類的名稱。完成此操作後,單擊「創建模板」,就可以進行下一步了。

創建一個Elementor 404頁面模板「 width =」 1974「 height =」 1110

步驟2:設計網頁

如上所述,精心設計的404頁面可以防止用戶在遇到您的網站時離開您的網站。當然,它們還可以增加參與度並降低您的跳出率,這就是為什麼這一步如此重要的原因。

因此,在創建404頁面時,您可以採用一些策略。對於初學者,您可以使用幽默來「減輕打擊」並幫助防止用戶感到沮喪:

擁抱寵物保險404錯誤頁面。「 width =」 2296「 height =」 1206

Embrace Pet Insurance的此類圖像有助於使他們的404頁有趣又可愛。您還可以使用有趣的圖像或反映您的品牌的圖像:

Crunchbase 404錯誤頁面。「 width =」 1222「 height =」 1038

您可能要添加的其他元素包括聯繫信息,搜索欄(就像我們一樣)以及指向您首頁的鏈接。您還可以考慮以類似於GitHub在其404頁底部的方式向您的最受歡迎內容甚至站點地圖添加一些鏈接:

GitHub 404錯誤頁面。「 width =」 2148「 height =」 1282

組合這些功能可以使您遇到404錯誤頁面的樂趣。實際上,有些人甚至會故意輸入錯誤的URL,以了解他們最喜歡的網站是如何設計他們的。

要設計頁面,您可以從Elementor的404頁面模板之一開始,然後使用Elementor的可視化和拖放界面自定義其以匹配您的品牌和語音:

Elementor 404頁面模板「 width =」 1972「 height =」 1275

Elementor包含您需要的所有小部件(包括搜索表單),因此您還可以使用拖放界面從頭開始構建404頁面模板。

如果您想在這裡伸出援手,我們有 有關如何使用Elementor的教程。雖然該教程專註於構建產品啟動頁面,但是您可以將相同的基本原理應用於404頁面設計。

步驟3:發布新的404錯誤頁面

此時,剩下的就是發布新的404錯誤頁面。

為此,請單擊Elementor界面左下角的發布。這將打開“發布設置''彈出窗口,可讓您控制顯示模板的位置。

Elementor已經選擇了404頁面,因此您只需單擊Save&Close即可啟用新的自定義404頁面模板:

發布Elementor模板「 width =」 2164「 height =」 1457

現在,只要有人點擊斷開的鏈接或錯誤輸入網址,而不會迷路,他們就會在您的自定義404錯誤頁面上發現自己。這將為您提供更好的機會,使用戶在瀏覽您的網站時保持參與度和滿意度。

結論

無論您在設計時多麼細緻,用戶有時都會在您的站點上遇到404錯誤頁面。當他們這樣做時,優化404頁面模板不僅可以提高跳出率,還可以提供更好的用戶體驗。

本文討論了使用起來有多麼容易 元素Elementor Pro 建立自訂的404網頁。只有三個步驟,因此讓我們快速回顧一下:

  1. 創建一個新的404頁面模板。
  2. 設計頁面或選擇Elementor的模板之一。
  3. 發布新的404錯誤頁面。

最後,僅僅因為您的網站上有一個很棒的404新頁面,並不意味著您希望人們看到它!要首先阻止404錯誤發生,請查看我們在上發布的信息 如何在WordPress中找到損壞的鏈接如何使用301重定向修復404錯誤

#404錯誤發生,但是自定義#WordPress 404錯誤頁面將錯誤轉化為機會?

點擊鳴叫

您對404錯誤頁面或如何在WordPress中設置頁面有任何疑問嗎?在下面的評論部分提問!

相關文章