指南/建立內容/設計/將圖示新增至按鈕

將圖示新增至按鈕

你可以將圖示或圖片新增至按鈕,例如,電話圖示 (📞) 可作為按一下撥打按鈕,電子郵件圖示 (📧)、箭頭 (⬅️ ➡️) 可作為閱讀更多內容按鈕,或任何你能想到的內容。閱讀此指引,了解如何將圖示新增至按鈕。

尋找要使用的圖示

有許多網站,你可以在其中找到能在網站使用的圖片或圖示。一些範例包含:

  • 大部分的 WindowsMac 和行動裝置都有內建的表情符號,你可以將這些符號新增至按鈕。
  • 你也可以從 Get Emoji 等網站複製表情符號。
  • Google Fonts 包含圖示選項
  • Font Awesome 這個熱門網站提供免費和付費圖示

如果使用圖片,建議使用 SVG 或 PNG (透明) 檔案類型。新增按鈕之前,你可以將圖示上傳到「媒體庫」,或者也可在新增按鈕時上傳圖示 (如下所述)。

將圖示新增至按鈕

你可以使用「按鈕」區塊以及選擇的圖示,將圖示或圖片新增至 WordPress.com 中的按鈕。按照下列步驟,將圖示新增至按鈕。

  1. 新增按鈕,以及包含按鈕的文字和連結。
  2. 按一下按鈕,並將游標置於文字之前或之後。
  3. 游標的放置位置視使用的是表情符號還是圖片而定:
    • 表情符號:使用 WindowsMac 的鍵盤快速鍵,然後選取該表情符號。或者,從如 Get Emoji 的網站複製並貼上表情符號。
    • 圖片:在出現的工具列,按一下向下箭頭 (更多),然後選取「內嵌圖片」選項。
      • 從「媒體庫」選擇圖片或上傳新圖片。
      • 按兩下圖片,即可變更圖片大小以及新增替代文字
  4. 按一下「儲存」或「發表」,即可儲存變更內容。

下列範例使用 Mac 鍵盤快速鍵來新增表情符號。你也可以使用 Windows 鍵盤快速鍵,或從其他網站複製並貼上表情符號。

Copied to clipboard!