mirror of
https://github.com/jambonz/next-static-site.git
synced 2026-10-10 13:34:22 +00:00
27 lines
1.1 KiB
Plaintext
27 lines
1.1 KiB
Plaintext
# Code Highlighting
|
|
|
|
`nextra-theme-docs` uses [Prism](https://prismjs.com) and [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer)
|
|
to highlight the code blocks. This section covers how you can customze it.
|
|
|
|
## More Languages
|
|
|
|
To keep the bundle small, only a [subset of languages](https://github.com/FormidableLabs/prism-react-renderer/blob/master/src/vendor/prism/includeLangs.js)
|
|
are included in the syntax highlighter. If you want to add more languages, you can do the following:
|
|
|
|
1. Run `yarn add prismjs prism-react-renderer` to add dependencies to your Nextra project.
|
|
2. Add the following code to your `pages/_app.js`:
|
|
|
|
```jsx
|
|
import Prism from 'prism-react-renderer/prism'
|
|
|
|
(typeof global !== "undefined" ? global : window).Prism = Prism
|
|
|
|
require("prismjs/components/prism-kotlin")
|
|
require("prismjs/components/prism-csharp")
|
|
```
|
|
|
|
Restart your app and you will have Kotlin and C# code highlighting supported.
|
|
You can find the full list of available languages [here](https://github.com/PrismJS/prism/tree/master/components).
|
|
|
|
{/*## Custom Themes*/}
|