Shiki Code
Integrates Shiki syntax highlighting for code blocks in Payload CMS.
Installation
pnpm add payload-shiki-code About
The Shiki Code plugin enhances Payload CMS by providing server-rendered syntax highlighting for code blocks using Shiki. This integration is particularly useful for rich text fields, offering support for over 60 programming languages and themes. It allows for extensive customization, including options for lazy loading, line highlighting, and display preferences such as line numbers and language labels. Installation requires adding the plugin to your Payload configuration, after which it can be easily integrated into collections or global fields. The plugin also includes lifecycle hooks for further extensibility and performance optimization through a cached highlighter instance. Developers can take advantage of TypeScript support throughout the configuration and usage, ensuring type safety and smooth development workflows. The plugin offers built-in support for defining which languages to include, reducing bundle size and improving render speed.
Package info
- Package name
payload-shiki-code- Latest version
0.0.3- Unpacked size
- 170 kB
- License
- MIT
- Weekly downloads
- 115
- Last publish
- Sep 17, 2025
More from escwxyz
View profileSimilar plugins
More in ContentShaggle Core
Adds ready-made collections, globals, and layout blocks for agency and hospitality sites to a Payload CMS config.
Meilisearch
Syncs Payload CMS collection documents to a Meilisearch index via afterChange and afterDelete hooks.
Nested Docs
Adds parent-child document hierarchies with auto-generated breadcrumbs to Payload collections.
Redirects
Manage redirects directly within the Payload CMS admin panel.
Media Preview
Preview images, videos, audio, and documents directly in the Payload CMS admin panel.
Iframe Tabs
Add iframes into separate tabs in the Payload admin panel.