Linux 软件免费装

在这里免费安装WordPress以及其他软件

Banner图

LumiCode Syntax Highlighter

开发者 cr8vstacks
更新时间 2026年6月1日 19:27
捐献地址: 去捐款
PHP版本: 8.0 及以上
WordPress版本: 6.9
版权: GPLv2 or later
版权网址: 版权信息

标签

developer syntax highlighter code snippet code block highlight.js

下载

1.5.6

详情介绍:

LumiCode is a premium-quality syntax highlighter built for developers and technical bloggers who want beautiful, readable code on their WordPress site — without fighting the editor. ✨ Key Features 🛠 How It Works LumiCode renders code blocks server-side (shortcodes + TinyMCE insertion) and enhances them on the frontend with a lightweight JS renderer. The renderer wraps <pre class="lumicode-pre"> elements in a beautiful VS Code–style chrome (titlebar, statusbar, line numbers, copy button) and runs highlight.js for syntax coloring. No page builders required. Works with any theme. Shortcode Usage [lumicode lang="javascript"] const greeting = "Hello, world!"; console.log(greeting); [/lumicode] All shortcode attributes: Performance

安装:

  1. Upload the lumicode-syntax-highlighter folder through Plugins -> Add New -> Upload Plugin, or place it in your site's plugins directory. — OR — install directly from the WordPress plugin search: Plugins → Add New → search "LumiCode"
  2. Activate the plugin through the Plugins menu in WordPress
  3. Go to LumiCode → Settings to choose your theme, font, and options
  4. Insert code blocks using:
  5. Classic Editor: click the âš¡ Code button in the TinyMCE toolbar
  6. Block Editor: search for "LumiCode" in the block inserter
  7. Shortcode: [lumicode lang="php"]...[/lumicode]

屏幕截图:

  • **Dark mode code box** — VS Code–style titlebar, traffic-light dots, copy button, statusbar
  • **Light mode code box** — switches chrome colors while keeping the hljs theme intact
  • **Collapse / Expand** — long blocks collapse with a gradient overlay and pill button
  • **TinyMCE dialog and scanner** — insert formatted code or find existing bare `<pre>` blocks

升级注意事项:

1.5.2 Recommended upgrade — fixes light mode in TinyMCE dialog, line number alignment, and expand/collapse reliability. No breaking changes.

常见问题:

Does this work with the Block Editor (Gutenberg)?

Yes. LumiCode includes a native Gutenberg block. Search for "LumiCode" in the block inserter.

Does this work with the Classic Editor?

Yes. LumiCode adds an âš¡ Code button to the Classic Editor (TinyMCE) toolbar. Click it to open the Insert Code Block dialog with language detection, filename, highlight lines, and collapse options.

Will it break my existing <pre> blocks?

No. LumiCode's auto-detect mode wraps existing <pre> blocks on the frontend only — your database content is never modified. You can also use the Code Scanner (LumiCode → Code Scanner) to see what it finds and apply the design selectively.

Can I use my own highlight.js theme?

All 13 built-in themes are bundled and available in Settings. Currently custom themes aren't supported.

Does it slow down my site?

LumiCode is designed for performance. highlight.js is served completely locally from your own server, eliminating third-party asset requests. Our own CSS + JS is under 15 KB combined, ensuring your site remains blazingly fast.

Can I have different settings per code block?

Yes. Per-block overrides work via shortcode attributes (lang, title, highlight, collapse, collapse-after) and via the TinyMCE dialog fields. Global defaults come from Settings.

Is it compatible with page caching plugins?

Yes. LumiCode is purely frontend-rendered — there are no per-request PHP computations on the frontend. Works with WP Rocket, W3 Total Cache, LiteSpeed Cache, and any other caching plugin.

What PHP version do I need?

PHP 8.0 or higher. WordPress 6.0 or higher.

更新日志:

1.5.6 1.5.5 1.5.4 1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.8 1.4.7 1.4.6 1.0.0