如何將 WordPress Favicon 添加到您的網站？ （3種方法）
已發表: 2022-04-08在瀏覽網站時，您一定注意到您的 WordPress 網站標題旁邊出現了一個小圖像，這些小圖像通常被稱為 WordPress Favicon。 微軟於 1999 年 3 月首次與 Internet Explorer 5 的新增功能“收藏夾”選項卡一起推出。
Microsoft 在其 Internet Explorer 5 版本中將書籤的名稱更改為收藏夾，並提供了一個選項，可以在 URL 旁邊包含收藏夾圖標。 這些收藏夾圖標現在被稱為“ Favicon ”。
但是，您也可以發現這些 WordPress Favicon 位於 Web 瀏覽器的書籤和瀏覽器的主屏幕上作為快捷按鈕。
這些 WordPress 網站圖標不僅看起來很漂亮，而且有助於增強用戶體驗、易於品牌識別和建立信任。 因此，在本文中，我們將嘗試涵蓋 WordPress Favicon 的所有方面以及如何輕鬆創建和添加到您的網站。
但首先，您必須了解，WordPress Favicon 的確切定義是什麼？ 讓我們開始吧！
什麼是 WordPress 網站圖標？
WordPress 網站圖標是通常大小為 16×16 像素的小圖標，代表您的品牌，位於您的頁面附近，您可以在瀏覽器的選項卡中輕鬆查看。
早些時候，當Google Analytics不存在時，Favicon 被用作確定網絡流量的工具。 但現在，它以增強用戶體驗和品牌認知度而聞名。
除此之外，擁有 WordPress Favicon 有助於提高品牌知名度。 因為它可以在您的瀏覽器選項卡、書籤、歷史檔案等上輕鬆可見。 它們還可以用作智能手機或標籤等小型設備上的網站快捷方式。 它有助於節省用戶的時間，讓他們輕鬆識別要瀏覽的網站，沒有任何困難。
為什麼使用 WordPress Favicon 有優勢？
除了品牌識別和增強用戶體驗之外，我們已經討論過使用 WordPress Favicon 的優勢是它可以確保訪問者正在瀏覽正確的網站並在正確的頁面上。
假設您在瀏覽器中打開了許多選項卡，隨著選項卡數量的增加，它將隱藏您網站的標題，如下所示：
此時，Favicon 幫助您快速識別您的網站，以便您輕鬆切換。 甚至，您可以要求訪問者在他們的瀏覽器主屏幕或智能手機等小型設備上添加網站快捷方式，以便輕鬆快速地訪問您的網站。
畢竟，每個網站的主要目標之一是提供獨特的用戶體驗，以便訪問者可以輕鬆地一次又一次地訪問該網站。 這就是 WordPress Favicon 在您的 WordPress 網站中的幫助，有助於建立強大的品牌認知度並將用戶體驗提升到一個新的水平。
現在讓我們看看，如何為您的網站創建漂亮的 WordPress Favicon。
如何創建 WordPress Favicon？
要創建 WordPress Favicon，您需要做的第一件事是確定 WordPress Favicon 的大小以及它應該支持的設備。 但是，已經有一個完整列表，列出了支持各種瀏覽器和平台的不同分辨率的網站圖標。
但在這篇文章中，我們將使用最受推薦和最廣泛接受的分辨率，以便您輕鬆為您的網站創建 WordPress Favicon，而不會產生任何混淆。
創建 WordPress Favicons 的一些最佳技巧
- Favicon 最推薦的分辨率是512×512像素。
- 選擇即使縮小到16×16像素分辨率也必須看起來很棒的圖像。
- 始終遵循 Google 提供的指南，才有資格在搜索結果旁邊顯示網站圖標。
- 您可以選擇矩形或方形圖像，因為您可以選擇在將其上傳到 WordPress 之後或之前對其進行自定義。
您可以通過多種方式創建 WordPress Favicon。 您可以聘請能夠更好地了解您的品牌並設計具有專業外觀的網站圖標的設計師。 您可以使用 WordPress Favicon 插件來創建 Favicon。 如果您知道如何使用 Adobe Photoshop，您甚至可以自己設計。
除此之外，還有各種在線工具可供使用，例如 Favicon generator 和 Favicon.cc，借助它們，您可以輕鬆創建 Favicon。
假設您要為您的網站 xyz.com 創建一個網站圖標。 您不知道如何使用 Adobe Photoshop，甚至沒有足夠的預算聘請專業設計師。 在這種情況下，您將使用 Favicon 生成器。
首先，您需要訪問該網站並上傳您希望它轉換為您的網站圖標的圖像，如下圖所示：
選擇適當的設置，例如
- 為 Web、Android、Microsoft 和 iOS 應用程序生成圖標
- 僅為 16×16 WordPress 生成圖標 Favicon.ico
選中這些框並單擊創建網站圖標按鈕。 該網頁將重新加載到下載頁面，您可以從中輕鬆下載 Favicon zip 文件，如下所示：
但是，您也可以手動將 Favicon 添加到您的網站，方法是複制如上所示的代碼並將其粘貼到 HTML 文檔的頭部。
如果您沒有選擇任何工具來設計您的網站圖標並選擇自己設計，那麼在開始設計之前您必須牢記一些要點。
- 保持設計簡潔乾淨，因為它會縮小其他人，細節可能會丟失。
- 您的網站圖標設計必須與您的網站主徽標具有相同的顏色、圖形或字體，或者必須代表您的品牌。
- 首先以更大的分辨率設計您的 Favicon，然後根據您的要求調整其大小。
完成 Favicon 設計後，您需要以支持的文件格式保存文件。 早些時候，有一種特定的 WordPress Favicon 文件類型“WordPress Favicon.ico”被廣泛使用。 但現在情況發生了變化，現在所有現代 Web 瀏覽器都支持 PNG、GIF 和 ICO 文件格式。
然而，JPEG 文件格式也是可用的並且被廣泛使用的格式來保存 Favicon 文件。 但是有一些舊版本的 Internet Explorer 不支持它們。 因此，最好只堅持那些獲得普遍支持的人。
如何在您的網站上上傳 WordPress Favicon？
成功設計並保存您的 Favicon 後，是時候將 Favicon 上傳或添加到您的 WordPress 網站了。 你可以通過三種方式來做到這一點，
- 通過 WordPress 定制器
- 使用插件添加 Favicon
- 手動添加 Favicon
使用 WordPress 定制器添加 Favicon
WordPress 4.3 版本發布後，引入了一個新選項，通過該選項，您可以輕鬆快捷地上傳和裁剪圖像以用作 Favicon。
您唯一需要做的就是上傳高質量的清晰圖像，最好是 512X512 分辨率。 首先，登錄您的WordPress 儀表板 > 外觀 > 自定義，如下圖所示：
該頁面將加載到您需要單擊站點身份選項卡的自定義頁面，如下所示：
單擊站點標識選項卡後，您需要注意如圖所示的“選擇站點圖標”按鈕。
之後，將彈出一個 WordPress 媒體界面，您可以在其中上傳圖像或使用媒體庫中的現有圖像來製作您的 Favicon。 現在單擊位於右下角的“選擇”按鈕。
之後，您可以裁剪或調整所選圖像的大小以使其非常適合您的 Favicon，然後單擊“裁剪圖像”按鈕以完成它。
完成上述所有步驟後，是時候保存所有更改並點擊發布按鈕使其生效。 但是，任何時候如果您對 Favicon 不滿意，您需要重複上述步驟以更改 WordPress Favicon。
使用 WordPress Favicon 插件將 Favicon 添加到您的站點
如果您正在尋找除默認 WordPress 站點圖標功能以外的更多選項，那麼您可以藉助 WordPress Favicon 插件。 有各種免費和流行的 Favicon 插件可用，它們具有相同的簡單功能，但為您提供更多的兼容性選項和更定制的體驗。
您可以使用的最流行和廣泛使用的 WordPress Favicon 插件之一是 RealFaviconGenerator 的 Favicon。
該插件過於重視兼容性，因此您可以設置與大多數流行的 Web 瀏覽器兼容的響應式 Favicon。
首先，您需要通過WordPress 儀表板 > 插件 > 添加新安裝 ReavFaviconGenerator 插件。
然後單擊“安裝”按鈕並激活它。 現在轉到外觀 > Favicon並從媒體庫中選擇至少應為 70×70 的圖片，然後單擊Generate Favicon按鈕，如下所示：
當您點擊 Generate favicon 時，您將被重定向到插件網站，您需要向下滾動並點擊“ Generate your Favicons and HTML code ”按鈕。
當該工具在後台運行時，它會將您重定向回 WordPress 儀表板。 現在您的網站圖標已準備就緒。
手動添加 WordPress Favicon
如果您不知道如何訪問根目錄，我們強烈建議您堅持以上兩種簡單的方法。 但是，如果您仍然喜歡使用手動方法，那麼您將需要通過 FTP 客戶端或您的Web 託管服務提供商提供的 cPanel 來執行此操作。
第 1 步：但在此之前，您需要訪問 Realfavicongenrator 網站。 單擊“選擇您的 Favicon 圖像”按鈕以生成您的 Favicon。
上傳圖像後，您會注意到與使用 RealFaviconGenerator 插件時相同的用戶界面。 如果您願意，可以自定義或進行更改，然後向下滾動網頁，然後單擊“生成您的網站圖標和 HTML 代碼”按鈕，如下所示：
第 2 步：當您單擊Generate your Favicons and HTML code按鈕時，頁面將移至下一頁，您可以從該頁面下載Favicon Package 。
提取下載的 Favicon 包並通過 FTP 客戶端或託管客戶端提供的 cPanel 將其上傳到您的網站根目錄。
在WPOven ，我們努力為用戶提供獨特的體驗，他們的便利是我們的首要任務。 因此，我們提供了一個新的文件管理器來輕鬆管理您的站點文件和文件夾。
介紹我們的新站點工具文件管理器。
使用 WPOven 的文件管理器，您可以輕鬆管理站點的文件和文件夾。 您可以輕鬆地執行以下各種任務。
- 安裝 WordPress 插件和主題
- 創建、編輯、刪除、重命名、移動和添加文件和文件夾
- 使用 zip 或解壓縮文件創建檔案
- 對文件進行排序
- 搜索文件和文件夾
- 上傳文件
要通過文件管理器工具訪問您站點的文件和文件夾，您需要先登錄到 WPOven 儀表板。 然後選擇您要處理的站點。
然後選擇“工具”子菜單並單擊“啟動文件管理器”按鈕。
您現在可以在文件管理器中查看站點的文件和文件夾
單擊“添加文件”按鈕並選擇要上傳的提取文件。
但是您必須知道，您要放置的文件必須在根文件夾中，否則它將不起作用。
第 3 步：要完成整個過程並使事情正常運行，您需要做的最後一步是將 RealFaviconGenerator 生成的代碼片段添加到 WordPress 主題的 head 部分。
要將以下代碼片段添加到頁眉部分，您需要安裝並激活頁眉和頁腳插件。 然後導航到設置>插入頁眉和頁腳並將代碼片段粘貼到頁眉部分，如下圖所示，然後單擊保存。
完成所有步驟後，您的網站圖標應該開始出現。
如果 WordPress Favicon 沒有顯示怎麼辦？
如果您的 WordPress Favicon 沒有顯示，即使您已按照上述所有步驟操作，則可能是由於以下原因：
- 使用了錯誤的 WordPress Favicon 文件類型——PNG、GIF 和 JPEG 是現代瀏覽器現在支持 Favicon 的一些圖像文件格式。 但是舊瀏覽器不支持它們。 除此之外，即使是大多數網絡瀏覽器都更喜歡使用 WordPress Favicon.ico 文件格式，因此最好選擇。 Ico 格式以避免任何兼容性問題。
- 無法配置適當的網站圖標大小- 不向您的網站顯示網站圖標的另一個原因可能是網站圖標圖像大小與設備屏幕尺寸不兼容。 這可以通過使用 favicon.ico 文件類型來消除，該文件類型存儲不同大小和分辨率的圖像的多個版本。 因此，在任何屏幕尺寸上都可以輕鬆看到網站圖標。
- WordPress Favicon 插件與主題不兼容– 如果您使用的是 WordPress Favicon 生成器插件，它也可能顯示與您正在使用的當前主題不兼容的問題。 因此，最好檢查插件更新，它是否與您當前的主題和 WordPress 版本兼容。
概括
現在，您已經了解了 WordPress Favicon 如何幫助品牌識別和增強用戶體驗。 最好的部分是，任何人都可以通過遵循所有指南和這些簡單的步驟在他們的網站上輕鬆創建和實施 Favicon：
- 您可以使用大量可用選項輕鬆創建網站圖標，例如使用在線網站圖標生成器工具、插件並在專業人員的幫助下。
- 您還可以通過 WordPress 自定義選項輕鬆地將它們添加到您的網站，使用插件或手動操作。
最後，如果您有任何更有價值的觀點要補充，我們在這篇文章中沒有提到，請在下面的評論部分告訴我們：
經常問的問題
如何將網站圖標添加到 WordPress？
您主要可以通過三種方式將網站圖標添加到您的 WordPress 網站：
1. 使用 WordPress 自定義選項
2.您可以藉助 WordPress Favicon 插件
3. 您可以使用 FTP 客戶端手動添加。
WordPress favicon 的大小應該是多少？
強烈推薦的 WordPress Favicon 大小為 512×512 像素。
如何製作一個好的網站圖標？
您可以按照以下提示製作一個好的 Favicon：
1. 創建一個展示您的品牌的設計。
2. Favicon 必須與網站標誌相似。
3. 正面、顏色和設計必須與網站主題相匹配。
4、設計必須乾淨、獨特。
5. 並將文件保存為 Ico 格式，使其包含不同大小和分辨率的多個版本的 favicon。