如何為您的 WordPress 網站創建網站圖標
已發表: 2022-08-19大多數品牌或營銷專家都喜歡分享他們對知名度的看法。 簡而言之,您可以說您網站中使用的用戶元素必須反映您的想法。 絕不能為您的 WordPress 網站考慮創建站點圖標的任務。
但現在網站圖標創建和上傳到您的 WordPress 網站的任務變得更加容易。 但是,有很多不同的方法可以簡化此任務
在互聯網上,您可以找到多種方法,以最少的預算、專業知識和時間來完成這項任務。
在本博客中,我們將學習一些為您的 WordPress 網站設計網站圖標的方法。 首先,熟悉為什麼需要為 WordPress 創建站點圖標。 除此之外,我們還將了解在創建站點圖標時需要考慮的一些事實。
您所說的站點圖標是什麼意思,為什麼將它放在您的 WordPress 網站上很重要?
您可能已經多次看到網站圖標。 但是您還沒有意識到這是站點圖標。 事實上,現在您也可以在瀏覽器窗口的左上角看到站點圖標。
站點圖標被認為是顯示在搜索引擎結果頁面或瀏覽器頁面選項卡旁邊的重要小圖標。
但是,您可以創建自己的站點圖標來指定您的品牌。
當我們談論您網站的品牌時,重要的是您的網站應該能夠在第一眼就給您的訪問者留下深刻印象。
如果您的品牌看起來很棒且專業,新客戶將能夠信任它。 網站圖標可以幫助您獲得信任並僅在第一印像中給訪問者留下深刻印象。
實際上,不是一個完整的品牌戰略將取決於您的網站圖標的外觀。 但是,如果您是潛在用戶瀏覽您的網站的時間較長,則會產生積極影響,並提高網站的知名度。
3個簡單的步驟來創建您網站的網站圖標
在此任務中,需要考慮所涉及的兩種不同情況。 首先是你需要建立一個站點圖標。 然後,您必須將創建的站點圖標上傳到您的 WordPress 網站。
為 WordPress 創建站點圖標的三個基本步驟是
- 選擇合適的圖標大小
- 在設計網站圖標時,請遵循一些最佳做法
- 對於工作,選擇一個完美的工具
在此之後,我們將學習一些基本的上傳圖標的三個步驟:
- 利用 WordPress 的預製功能
- 要上傳圖標,請使用插件
- 要上傳站點圖標,請編寫代碼
現在讓我們詳細了解所有這些步驟
第 1 步:為您的網站圖標選擇合適的尺寸
最重要的是站點圖標的大小。 是的,這些文件的大小確實很小,但是您需要查看此圖標中涉及的各個維度。 這一點很重要,因為每個平台都有不同的站點圖標要求。
您會發現有些瀏覽器支持 32*32 像素的 .ico 文件。 這種圖標大小的大小被稱為標準大小。
但實際上,您必須使用大小為 512* 512 像素大小的 .png 文件。 大多數情況下使用 .png 文件,因為幾乎每個默認瀏覽器都有這個大小的站點圖標。
第 2 步:確保您在設計網站圖標時使用了最佳實踐
我們建議您不要選擇簡單的選項,而是專注於優化品牌並使用自定義網站圖標。
使用您現有的徽標,您無法為您的網站打造品牌。 但是,您需要遵循一些趨勢來為 WordPress 創建站點圖標。
- 為您的網站圖標選擇一種或兩種簡單的顏色,以確保它看起來一致且清晰可見。
- 最小化您的徽標
- 利用一些亮度來關注網站圖標的主要方面。
讓我們看一個真實世界的例子。 查看 SKT Themes 的網站圖標。 它使用提供高對比度的橙色,並更加關注其網站的徽標。
這就是你所需要的。 連同另一個元素的品牌,它提供了一致性和可見性,並確保它在瀏覽器屏幕選項卡上可見。
第 3 步:創建您的網站圖標選擇正確的工具
一旦你完成了網站圖標的大小和設計來創建它,下一步就是選擇一個正確的工具。 正如我們上面提到的,您會發現有多種方法可以在 WordPress 上為 WordPress 創建站點圖標。
但是,如果您知道如何使用 CANVA,那麼您就有了創建站點圖標的最理想方式。 您會發現 CANVA 的更多替代選項。 最好的選擇之一是 designBold 。
另一個快速創建純文本站點圖標的替代方法是 https://favicon.io/favicon-generator/。 該工具還將幫助您下載不同大小的站點圖標。
不要忘記將站點圖標保存在 8 位或 24 位不透明 .PNG 文件之間很重要。 這是最優化的格式。 但是,favicon.io 將幫助您實現這一目標。
在您的網站上上傳網站圖標的 3 種不同方法是:
在 WordPress 中,您會發現上傳網站圖標的不同方法。 您將在下面找到上傳網站圖標的最佳方式。
1.利用WordPress的內置功能
WordPress 提供了在您的 WordPress 網站上上傳網站圖標的最佳方式和最簡單的方式
如果您正在尋找最簡單和最快的方法,那麼您必須選擇此選項。
第 1 步:在 WordPress 中訪問您網站的身份屏幕
為此,您首先需要通過 WordPress 儀表板登錄 WordPress。 現在轉到主題選項面板。 高級主題包含許多選項。
考慮一個使用 WordPress 默認主題的示例,然後您需要轉到外觀,然後單擊自定義自定義程序的單擊現場身份屏幕。
一旦你現在完成了,你需要邁向另一個步驟
第 2 步:選擇您的網站圖標
現在查看另一個部分,即站點標識以選擇站點圖標。
單擊“選擇站點圖標”並上傳文件。 確保添加“替代文本”以增強可訪問性。
第 3 步:在前端,檢查您的網站圖標
現在,在您的網站上檢查前端,以了解網站圖標是否已成功上傳到您的網站。 您會發現 WordPress 將在瀏覽器模型中提供現有站點圖標的大預覽。
但是,您必須檢查您的站點圖標在 Web 瀏覽器中的外觀或呈現方式。 這是必須考慮的最重要的因素。
2.添加WordPress插件
對於初學者或非技術人員,上傳網站圖標的最佳解決方案是集成 WordPress 插件。 使用 WordPress 網站的客戶可以訪問內置定制器選項。
如果您對 WordPress 站點圖標有特殊要求,那麼我們建議您採用這種方法,否則您必須在主題選項的幫助下上傳站點圖標。
Step1:選擇合適的插件
我們想推薦的最好的插件之一是 RealFaviconGenerator 的 Favicon
RealFaviconGenerator.net 是幫助您生成網站圖標的最受歡迎的網站之一。 但是,RealFaviconGenerator 的 Favicon 是 RealFaviconGenerator.net 的流行插件版本。
該插件將僅從單個圖像生成不同的站點圖標,並且站點圖標將存儲在媒體庫中。
Step2:上傳一個全尺寸的站點圖標
安裝並激活插件後,下一步將是登錄 WordPress 儀表板並單擊外觀,然後單擊圖標面板。 在這裡,您會發現許多感覺並不復雜的自定義選項。
你會發現一些令人困惑的詞,但不用擔心,你只需要從媒體庫上傳文件。 在這裡您需要添加替代文本,不要忘記添加它。
現在開始單擊顯示“生成網站圖標”的藍色按鈕,然後跳到另一個步驟。
第 3 步:下載網站圖標
上傳文件後,插件將開始生成站點圖標。 您會發現該插件會將開發者網站的版本轉換為 Web 應用程序版本。 在這裡,您可以找到各種維度和平台的不同站點的站點圖標。
從這裡您可以選擇一些特定於平台的選項,這些選項屬於您的站點圖標和設計的呈現方式。
現在您需要單擊“生成您的網站圖標和 HTML 代碼”。 現在您會發現您的插件將如何神奇地開始工作。
您現在將在 WordPress 儀表板中找到用於預覽站點圖標的選項。
相關文章:將 Favicon 添加到 WordPress 網站的快速指南
3. 要顯示您的站點圖標,請使用代碼
我們要建議的最後一步對於普通用戶來說基本上是一個過時的解決方案。 但是您可以使用代碼來展示站點圖標以滿足各種類型的需求。 如果您正在構建自定義主題,此選項也是更好的選擇。
第 1 步:使用文件傳輸協議,您可以訪問 WordPress 網站的服務器
要遵循這種方法,您需要通過 FTP 訪問服務器。 另外,您將需要一些基本的編碼知識,因為我們將處理 WordPress 的核心文件,我們建議您使用子主題。
一旦您可以訪問所有這些東西,您就可以登錄到服務器。 您可以通過主機控制面板訪問您的憑證。
如果您想知道在哪裡可以找到所有這些憑據,那麼您可以連接到主機的支持渠道。
第 2 步:到您的 WordPress 網站,上傳網站圖標
當您登錄服務器時,FTP 客戶端會顯示您網站的目錄列表。
在這裡將站點圖標文件上傳到您網站的根目錄和主主題文件夾。
現在你幾乎完成了。 現在最後一步是在 WordPress 中編寫您的站點圖標。
第 3 步:在您的 WordPress 標題中,添加代碼
這是最後一步,也是您最後一次登錄 WordPress 儀表板。 現在轉到外觀,然後單擊主題編輯器頁面:
當您嘗試訪問該頁面時,將生成一個警告對話框彈出窗口。 在單擊我了解之前,請確保您已閱讀所有內容。
現在將顯示可以輕鬆編輯的代碼。 在這裡從拖放菜單選項中選擇主題。 現在在這裡搜索代碼行
現在下面提到的代碼將它添加到
<頭部>
標籤
<link rel="快捷圖標" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
現在單擊更新文件按鈕。
結論:
此博客中提到了為 WordPress 創建站點圖標的基本步驟。