[WordPress] 外掛分享： Spectre Icons

WordPress 外掛 Spectre Icons 的封面圖片。

前言介紹

  • 這款 WordPress 外掛「Spectre Icons」是 2026-01-26 上架。
  • 目前有 30 個安裝啟用數。
  • 上一次更新是 2026-01-27，距離現在已有 30 天。
  • 外掛最低要求 WordPress 6.0 以上版本才可以安裝。
  • 外掛要求網站主機運作至少需要 PHP 版本 7.4 以上。
  • 有 1 人給過評分。
  • 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。

外掛協作開發者

phcdevworks |

外掛標籤

SVG | icons | lucide | elementor | Font Awesome |

內容簡介

總結：
Spectre Icons 將現代 SVG 圖標庫（如 Lucide 和 Font Awesome）直接整合到 WordPress 建置者中，提供統一、專注於性能的圖標系統，取代了數十個分散的圖標外掛程式。

問題與答案：
1. Spectre Icons 主要提供了哪些主要功能？
- 基於清單驅動的圖標加載以達到最佳性能
- 內聯 SVG 渲染與主題顏色繼承
- 官方支援社交媒體圖標品牌
- 透過頁面構建器的顏色選擇器進行自定義顏色控制
- 在建置者編輯器中注入實時預覽
- 管理員控制面板切換圖標庫
- 未來建置者整合的模塊化架構

2. 目前哪些 WordPress 建置者與 Spectre Icons 有完整的支持？
- Elementor 3.x+

3. 包括哪些圖標庫在 Spectre Icons 中？
- Lucide Icons：現代、乾淨的輪廓圖標（ISC 許可證）
- Font Awesome Free：流行的圖標庫，包含實心、常規和品牌風格（CC BY 4.0 圖標/MIT 代碼）

4. 誰最適合使用 Spectre Icons？
- 需要現代圖標庫的 Elementor 設計師
- 構建自定義 WordPress 主題的開發人員
- 管理多個客戶網站的代理商
- 對安裝多個圖標外掛程式感到厭倦的任何人

5. 如何運作 Spectre Icons？
- 將 SVG 圖標包存儲在優化的 JSON 清單中
- 外掛將清單註冊為 Elementor 库
- JavaScript 在編輯器和前端中注入內聯 SVG
- CSS 負責處理顏色繼承和官方品牌。

這些問題與答案已使用 HTML 項目符號列表呈現。

原文外掛簡介

Spectre Icons brings modern SVG icon libraries like Lucide and Font Awesome directly into WordPress builders—delivering a unified, performance-first icon system that replaces dozens of fragmented icon plugins.
Key Features

Manifest-driven icon loading for optimal performance
Inline SVG rendering with theme color inheritance
Official branding support for social media icons
Custom color control via page builder color pickers
Live preview injection in builder editors
Admin control panel to toggle icon libraries
Modular architecture for future builder integrations

Current Integration

Elementor 3.x+ (full support)

Future releases will support Gutenberg, Beaver Builder, and other popular page builders.
Included Icon Libraries

Lucide Icons – Modern, clean outline icons (ISC License)
Font Awesome Free – Popular icon library with solid, regular, and brand styles (CC BY 4.0 icons / MIT code)

Perfect For

Elementor designers who need modern icon libraries
Developers building custom WordPress themes
Agencies managing multiple client sites
Anyone tired of installing multiple icon plugins

How It Works

SVG icon packs are stored in optimized JSON manifests
Plugin registers manifests as Elementor libraries
JavaScript injects inline SVGs in editor and frontend
CSS handles color inheritance and official branding

Use Cases

Add custom icons to any Elementor widget (Icon, Icon Box, Icon List, Social Icons)
Create branded social media icon sets with official colors
Build custom icon layouts with full color control
Maintain consistent icon styles across your entire site

Icon Attributions
This plugin bundles icons from Font Awesome Free and Lucide.
Font Awesome Free
Font Awesome Free is licensed under CC BY 4.0 (icons) and MIT (code).
https://fontawesome.com/license/free
Lucide Icons
Lucide is licensed under the ISC License (MIT-compatible).
https://lucide.dev
Additional Info
Part of the Spectre Suite

Spectre Tokens – Design token foundation
Spectre UI – Core styling layer
Spectre Icons – Icon library for WordPress (this plugin)
Spectre Blocks – WordPress block library
Spectre Astro – Astro integration
Spectre 11ty – Eleventy integration

Contributing
Contributions are welcome! Visit our GitHub repository for detailed contribution guidelines:
https://github.com/phcdevworks/spectre-icons
Support
For issues, questions, or feature requests:
* GitHub Issues: https://github.com/phcdevworks/spectre-icons/issues
* Documentation: https://github.com/phcdevworks/spectre-icons
Credits
Developed by PHCDevworks (https://phcdevworks.com)
Icon libraries:
* Lucide by Lucide Contributors
* Font Awesome by Fonticons, Inc.

各版本下載點

  • 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
  • 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Spectre Icons」來進行安裝。

（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。

1.1.0 | trunk |

延伸相關外掛（你可能也想知道）

  • SVG Support 》這個 WordPress 外掛可以安全地上傳 SVG 檔案至媒體庫，並像其他圖片一樣使用。現在還有可選的清理功能！當你在網站上使用 SVG 圖片，很難使用 CSS 來設計 SV...。
  • Safe SVG 》Safe SVG 可以讓你安心地在 WordPress 中上傳 SVG 檔案！, 它能夠讓你允許上傳 SVG 檔案的同時，確保它們已經經過消毒以防止 SVG/XML 弱點影響你的網站。此外...。
  • Easy SVG Support 》將 SVG 檔案直接上傳至 WordPress, EASY SVG Support 是一個外掛，允許您將 SVG 檔案上傳到媒體庫中，特別為那些不需要太多 SVG 選項的人所創建。, 此外掛功...。
  • WP SVG Images 》安全上傳 SVG 檔案到您的媒體庫。上傳的 SVG 檔案將自動過濾。, SVG 代表可縮放向量圖形，是最有效率的顯示圖片的方式。, WP SVG Images 外掛是一個易於使用...。
  • The Icon Block 》Icon Block 外掛會註冊一個單一且易於使用的區塊，讓您可以在 WordPress 區塊編輯器 (Gutenberg) 中加入自訂的 SVG 圖示和圖形。, 該外掛還包含完整的 WordPr...。
  • Scalable Vector Graphics (SVG) 》SVG（可縮放向量圖形）是二維向量圖形，可以是靜態或動態的。此外掛可輕鬆讓您在網站上使用它們。, 主項目頁面位於此處：https://sterlinghamilton.com/proje...。
  • SVG Block 》這個 SVG 區塊可以讓你將 SVG 形象顯示為內嵌的 HTML 標記。你可以從擁有超過 3000 個圖示的圖示庫中選擇圖示，或者直接在區塊設定中上載或輸入自定義的 SVG ...。
  • Lemmony Companion 》The Lemmony Companion 是 Lemmony 佈景主題（即將推出）的伴隨外掛，為最佳佈景主題體驗添加了額外的區塊編輯器區塊。。
  • JVM Rich Text Icons 》這款外掛可以在 Gutenberg 區塊編輯器中的段落、標題、清單或按鈕等豐富文字區塊中添加內嵌圖示。該外掛以免費的 Font Awesome 圖示集作為預設圖示集。您可以...。
  • WP and Divi Icons 》該 WP and Divi Icons 外掛為您的網站添加了超過 660 個定制的輪廓 SVG 圖標，SVG 圖標是向量圖標，因此在任何屏幕上以任何大小顯示時都非常清晰，看起來非常...。
  • SVG Flags – Beautiful Scalable Flags For All Countries! 》SVG Flags of the world 可以讓您在幾秒內在WordPress網站上添加高質量的美麗旗幟。您可以以任何比例顯示一個或多個旗幟，而不會失去品質並且具有固定的長寬...。
  • SVG Icon Block 》總結：SVG Icon Block 是一款自訂的 Gutenberg 區塊外掛程式，讓使用者能夠將 SVG 圖示加入到其 Gutenberg 區塊編輯器中。這款外掛提供許多客製化選項，因此...。
  • WebP Conversion 》總結：WebP Conversion 是一個 WordPress 外掛，可以在上傳圖片至媒體庫時自動將其轉換為 WebP 格式，也可直接從媒體庫中進行單張或批量轉換，並提供靈活的設...。
  • Upload SVG 》總結：Upload SVG是一個安全且使用者友善的WordPress外掛程式，可以讓您安全地上傳和管理SVG檔案到您的媒體庫。SVG檔案可能包含惡意程式碼，但使用Upload SVG...。
  • Uploading SVG, WEBP and ICO files 》這個很棒的外掛讓你可以避免上傳 SVG、Webp 和 ICO 檔案時出現錯誤。只需安裝並啟用它，它就已經準備好使用了。。

文章
Filter
Apply Filters
Close
Mastodon