如何輕鬆在您的 WordPress 主題中添加圖示字型

04/01/2023

什麼是圖示字型以及為什麼要使用它們?

圖示字型包含符號或小圖片,而不是字母和數字。您可以在多種情況下使用這些圖示字型,例如購物車、下載按鈕、功能框、贈送活動甚至是 WordPress 導航菜單。實際上,WordPress 在其管理區域也使用圖示字型。

大多數訪問者會立即理解常用圖示的含義,因此它們可以讓您的網站更易於導航。相比於基於圖片的圖示,字型圖示加載速度更快,從而提高了網站的速度和性能。擁有幾個開源圖示字型集可供免費使用,但在本指南中,我們將使用最受歡迎的開源圖示集 Font Awesome。

方法 1. 使用 WordPress 插件添加圖示字型(簡單)

添加自定義圖示字型到 WordPress 最簡單的方法是使用 Font Awesome 插件。此插件允許您在頁面和帖子中使用免費圖示字型,而無需修改 WordPress 主題文件。

安裝並激活插件後,您可以將 Font Awesome 圖示添加到任何簡碼塊中。打開您希望顯示圖示字型的頁面或帖子,然後點擊“+”圖示。搜索“Shortcode”並選擇出現的正確塊。

輸入以下簡碼來添加任何 Font Awesome 圖示:

[icon name="rocket"]

將“rocket”替換為您想要顯示的圖示名稱。查看 Font Awesome 庫,點擊您想要使用的圖示,在彈出窗口中點擊圖示名稱,名稱將自動複製到剪貼板。

例如,要顯示“fire”圖示,可以使用:

[icon name="fire"]

方法 2. 使用 SeedProd 添加圖示字型(更自定化)

如果您想在網站上的任何地方使用圖示字型,我們推薦使用頁面建設插件。SeedProd 是市場上最好的拖放 WordPress 頁面建設工具,內置了超過 1400 個 Font Awesome 圖示。

首先,安裝並激活 SeedProd 插件。激活後,訪問 SeedProd » 設置,輸入您的許可密鑰。

替代方法:使用 SVG 圖示

另一種在 WordPress 中添加圖示圖像的方法是使用 SVG 圖示,這是一種用於向量圖形的常用圖像格式。SVG 向量圖標通常比圖示字型更易於 SEO 並且需要更少的伺服器請求來加載。

我們希望這個教程幫助您了解如何在 WordPress 主題中添加圖示字型。您還可以查看我們的彈出插件一覽以及如何選擇最佳網頁設計軟體的指南。

如果您喜歡這篇文章,請訂閱我們的 YouTube 頻道以獲取更多 WordPress 教學視頻。您還可以在 Twitter 和 Facebook 上找到我們。



Related Posts

  • 2024-07-20
  • WordPress 主题

您是否想在 WordPress 中為不同頁面使用多個佈景主題?可以自訂網頁的外觀和布局,為文章、頁面和部分區域建立模板。但是如果您想為網站的某些部分或頁面使用完全不同的佈景主題呢?本文將指導您如何在 WordPress 中為頁面使用多個佈景主題。

閱讀更多
  • 2024-07-19
  • WordPress 主题

您是否想在 WordPress 網站上添加回頂效果?這種效果在頁面較長時非常有用,可以讓用戶輕鬆返回頁面頂部,提升網站的用戶體驗。本文將教您如何使用 jQuery 和插件在 WordPress 中添加平滑回頂效果。

閱讀更多
  • 2024-07-13
  • WordPress 主题

您是否想在 WordPress 中創建一個自定義頁面?自定義頁面允許您使用與網站其餘部分不同的佈局。許多 WordPress 網站使用自定義頁面佈局來建立銷售頁面、登陸頁面、網路研討會頁面等。在這篇文章中,我們將向您展示如何輕鬆地在 WordPress 中創建自定義頁面。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>