mirror of
https://github.com/docsifyjs/docsify.git
synced 2025-12-08 19:55:52 +00:00
Update language-highlight.md
Proposed changes described in comment from #1251
This commit is contained in:
parent
76050e3680
commit
88f8a8003c
@ -1,26 +1,31 @@
|
||||
# language highlight
|
||||
# Language highlighting
|
||||
|
||||
**docsify** uses [Prism](https://github.com/PrismJS/prism) to highlight code blocks in your pages. By default it only supports CSS, JavaScript and HTML. You can make **Prism** load additional languages:
|
||||
Docsify uses [Prism](https://prismjs.com) to highlight code blocks in your pages. Prism supports the following languages by default:
|
||||
|
||||
* Markup - `markup`, `html`, `xml`, `svg`, `mathml`, `ssml`, `atom`, `rss`
|
||||
* CSS - `css`
|
||||
* C-like - `clike`
|
||||
* JavaScript - `javascript`, `js`
|
||||
|
||||
Support for [additional languages](https://prismjs.com/#supported-languages) is available by loading the language-specific [grammar files](https://cdn.jsdelivr.net/npm/prismjs@1/components/) via CDN:
|
||||
|
||||
```html
|
||||
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
|
||||
<script src="//cdn.jsdelivr.net/npm/prismjs/components/prism-bash.min.js"></script>
|
||||
<script src="//cdn.jsdelivr.net/npm/prismjs/components/prism-php.min.js"></script>
|
||||
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
|
||||
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-php.min.js"></script>
|
||||
```
|
||||
|
||||
To use the new languages, make sure the code block label matches the part after `prism-` in the file name. FOr example, for `prism-bash.js` write a code block labeled with `bash` like this:
|
||||
To enable syntax highlighting, wrap each code block in triple backticks with the [language](https://prismjs.com/#supported-languages) specified on the first line:
|
||||
|
||||
````
|
||||
```html
|
||||
<p>This is a paragraph</p>
|
||||
<a href="//docsify.js.org/">Docsify</a>
|
||||
```
|
||||
|
||||
```bash
|
||||
echo "hello"
|
||||
```
|
||||
````
|
||||
|
||||
?> Note that with GitHub-flavored markdown, `sh` and `bash` are effectively aliases of each other, but this is not the case with Prism. So using `sh` will not enable `bash` syntax in this case.
|
||||
|
||||
For `prism-php.js`, it would be:
|
||||
|
||||
````
|
||||
```php
|
||||
function getAdder(int $x): int
|
||||
{
|
||||
@ -29,4 +34,20 @@ function getAdder(int $x): int
|
||||
```
|
||||
````
|
||||
|
||||
?> Check the [component files](https://github.com/PrismJS/prism/tree/gh-pages/components) list for more options.
|
||||
The above markdown will be rendered as:
|
||||
|
||||
```html
|
||||
<p>This is a paragraph</p>
|
||||
<a href="//docsify.js.org/">Docsify</a>
|
||||
```
|
||||
|
||||
```bash
|
||||
echo "hello"
|
||||
```
|
||||
|
||||
```php
|
||||
function getAdder(int $x): int
|
||||
{
|
||||
return 123;
|
||||
}
|
||||
```
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user