Àpèjúwe

LumiCode is a premium-quality syntax highlighter built for developers and technical bloggers who want beautiful, readable code on their WordPress site Ìtumọ̀ Yorùbá: – without fighting the editor.

Key Features

40+ languages auto-detected Ìtumọ̀ Yorùbá: – PHP, JavaScript, TypeScript, Python, Go, Rust, SQL, YAML, Bash, and more
13 bundled themes Ìtumọ̀ Yorùbá: – Atom One, Dracula, GitHub, Monokai, Night Owl, Nord, Solarized, VS 2015, Xcode, and more, powered by highlight.js 11.11.1
Dark & Light mode Ìtumọ̀ Yorùbá: – toggle from the admin topbar. Applies to both admin UI and frontend code boxes
Copy to Clipboard Ìtumọ̀ Yorùbá: – one-click copy button on every code block
Line numbers Ìtumọ̀ Yorùbá: – perfectly aligned, synced to font size and line height
Collapse / Expand Ìtumọ̀ Yorùbá: – long code blocks auto-collapse after a configurable number of lines
Filename / language badge Ìtumọ̀ Yorùbá: – shows in the titlebar of every code box
TinyMCE integration Ìtumọ̀ Yorùbá: – Insert Code Block button in the Classic Editor toolbar, with language detection and all options
Gutenberg block Ìtumọ̀ Yorùbá: – native block editor support
Code Scanner Ìtumọ̀ Yorùbá: – scans your entire site for bare <pre> blocks and lets you apply LumiCode with one click, or dismiss
Auto-detect Ìtumọ̀ Yorùbá: – wraps any existing <pre> blocks automatically on the frontend without touching your content

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:
* lang Ìtumọ̀ Yorùbá: – language identifier (e.g. php, python, typescript)
* title Ìtumọ̀ Yorùbá: – filename shown in titlebar (e.g. config.js)
* highlight Ìtumọ̀ Yorùbá: – lines to accent (e.g. 1,3-5)
* collapse Ìtumọ̀ Yorùbá: – force collapse (true/false)
* collapse-after Ìtumọ̀ Yorùbá: – collapse after N lines (overrides global setting)

Performance

highlight.js is loaded locally (v11.11.1) for speed and privacy
Our CSS and JS are tiny (<15 KB combined, unminified)
No jQuery dependency on the frontend

Àwọn àwòrán ìbòjú

Settings page - theme picker, font options, toggles for line numbers, copy button, and collapse — **Settings page** Ìtumọ̀ Yorùbá: – theme picker, font options, toggles for line numbers, copy button, and collapse

Dark mode code box - VS Code-style titlebar, traffic-light dots, copy button, statusbar — **Settings page** Ìtumọ̀ Yorùbá: – theme picker, font options, toggles for line numbers, copy button, and collapse

Àwọn ìdí

Plugin yìí pèsè 1 ìdí.

Lumicode Code Block

Ìgbéwọlẹ̀

Upload the lumicode-syntax-highlighter folder through Plugins -> Add New -> Upload Plugin, or place it in your siteÌtumọ̀ Yorùbá: ’s plugins directory.
- OR Ìtumọ̀ Yorùbá: – install directly from the WordPress plugin search: Plugins -> Add New -> search “LumiCode”
Activate the plugin through the Plugins menu in WordPress
Go to LumiCode -> Settings to choose your theme, font, and options
Insert code blocks using:
- Classic Editor: click the Code button in the TinyMCE toolbar
- Block Editor: search for “LumiCode” in the block inserter
- Shortcode: [lumicode lang="php"]...[/lumicode]

FAQ

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 ` ` blocks: No. LumiCodeÌtumọ̀ Yorùbá: ’s auto-detect mode wraps existing <pre> blocks on the frontend only Ìtumọ̀ Yorùbá: – 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Ìtumọ̀ Yorùbá: ’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 Ìtumọ̀ Yorùbá: – 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.

Àwọn àgbéyẹ̀wò

Kò sí àwọn àgbéyẹ̀wò fún plugin yìí.

Àwọn Olùkópa & Olùgbéejáde

“LumiCode Syntax Highlighter” jẹ́ ètò ìṣàmúlò orísun ṣíṣí sílẹ̀. Àwọn ènìyàn wọ̀nyí ti ṣe ìkópa sí plugin yìí.

cr8vstacks

Túmọ̀ “LumiCode Syntax Highlighter” sí èdè rẹ.

Ṣe o nífẹ̀ẹ́ sí ìdàgbàsókè?

Ṣàwárí koodu, ṣàyẹ̀wò ibi ìpamọ́ SVN, tàbí ṣe àgbékalẹ̀ sí àkọsílẹ̀ ìdàgbàsókè nípasẹ̀ RSS.

Àkọsílẹ̀ àwọn àyípadà

1.5.6

Maintenance: Updated bundled highlight.js to v11.11.1 and kept assets served locally.
Maintenance: Refined bundled asset loading and shortcode behavior.
Maintenance: Refined code block handling across shortcode, scanner, block editor, and auto-enhance flows.
Fix: Updated Plugin URI to point to the public LumiCode preview page.

1.5.5

Maintenance: Improved generated code block markup and frontend enhancement behavior.
Maintenance: Updated bundled assets and admin loading flow.
Fix: Improved plugin metadata and shortcode naming consistency.

1.5.4

Maintenance: Refined bundled library handling and admin asset loading.
Maintenance: Improved frontend enhancement behavior.
Maintenance: Updated shortcode registration.
Bug Fix: Corrected CSS appearance property in dialog.

1.5.3

Added frontend recognition for inline code-style elements: <code>, <kbd>, <samp>, and <var>.
Added inline styling for those elements so examples like service-row, service-row-1, and similar tokens render clearly in paragraphs and lists.
Updated inline code styling to use a transparent background, #1e40af text color, and a matching blue border color scheme.

1.5.2

Fix: TinyMCE Insert Code dialog now switches to light mode when admin is in light mode
Fix: Expand overlay now hides reliably on expand (CSS-driven, no JS timing issues)
Fix: Line number gutter alignment Ìtumọ̀ Yorùbá: – padding and line-height precisely match code area
Fix: Line height reduced to 1.5 (standard for code editors, was 1.6)
Fix: Collapse bar now has 30px top/bottom padding for visual breathing room
Fix: All frontend CSS rules use !important for full isolation from theme styles
Fix: Enqueue handles are now versioned (prevents WordPress internal handle caching)
Improvement: Updated asset loading hints for better frontend performance.
Improvement: Collapse correctly wraps .lc-pw-lined when line numbers are on

1.5.1

Fix: Light mode toggle now reliably applies across admin and frontend
Fix: Collapse system Ìtumọ̀ Yorùbá: – wraps correct element when line numbers are enabled
Fix: Phosphor Icons decoupled from parent font-size (use explicit font-size)
Fix: Admin CSS enqueue handles versioned to prevent WordPress style registry caching
Fix: Complete light mode coverage with !important on all rules in admin-shared.css

1.5.0

Removed all custom cache-busting systems Ìtumọ̀ Yorùbá: – back to simple LUMICODE_VERSION
Inline vanilla JS toggle in topbar (no jQuery dependency)
DB setting light_mode now controls both admin and frontend
Code block overlay collapse / expand redesign with gradient + backdrop blur

1.4.9

LUMICODE_BUILD token system for zip-level cache busting
Overlay collapse design with gradient + backdrop blur
Frontend/admin light mode sync via DB setting

1.4.8

filemtime()-based cache busting for CSS/JS
Inline expand/collapse pill
Light mode system via .lc-pw-is-light class
Scanner dismiss persistence

1.4.7

File-rename-based cache busting
DB-based asset version timestamps
Flush Asset Cache button in settings

1.4.6

TinyMCE editor insertion flow
hljs warnings fixed
wpautop inline fix

1.0.0

Initial release

Àpèjúwe

Key Features

How It Works

Shortcode Usage

Performance

Àwọn àwòrán ìbòjú

Àwọn ìdí

Ìgbéwọlẹ̀

FAQ

Does this work with the Block Editor (Gutenberg)

Does this work with the Classic Editor

Will it break my existing ` ` blocks

Can I use my own highlight.js theme

Does it slow down my site

Can I have different settings per code block

Is it compatible with page caching plugins

What PHP version do I need