Skip to content
This repository was archived by the owner on Oct 11, 2022. It is now read-only.

Commit db47650

Browse files
committed
Add code highlighting note
1 parent 0ce60cf commit db47650

File tree

1 file changed

+24
-8
lines changed

1 file changed

+24
-8
lines changed

README.md

+24-8
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,13 @@ A [DraftJS] plugin for supporting Markdown syntax shortcuts in DraftJS. This plu
1111

1212
[View Demo][Demo]
1313

14-
## Usage
14+
## Installation
1515

1616
```sh
1717
npm i --save draft-js-markdown-plugin
1818
```
1919

20-
then import from your editor component
21-
22-
```js
23-
import createMarkdownPlugin from 'draft-js-markdown-plugin';
24-
```
25-
26-
### Full Example
20+
## Usage
2721

2822
```js
2923
import React, { Component } from 'react';
@@ -56,6 +50,28 @@ export default class DemoEditor extends Component {
5650
}
5751
```
5852

53+
### Add code block syntax highlighting
54+
55+
Using the [`draft-js-prism-plugin`](https://github.com/withspectrum/draft-js-prism-plugin) you can easily add syntax highlighting support to your code blocks!
56+
57+
```JS
58+
// Install prismjs and draft-js-prism-plugin
59+
import Prism from 'prismjs';
60+
import createPrismPlugin from 'draft-js-prism-plugin';
61+
62+
class Editor extends Component {
63+
state = {
64+
plugins: [
65+
// Add the Prism plugin to the plugins array
66+
createPrismPlugin({
67+
prism: Prism
68+
}),
69+
createMarkdownPlugin()
70+
]
71+
}
72+
}
73+
```
74+
5975
## Why fork the `markdown-shortcuts-plugin`?
6076

6177
Writing is a core part of our app, and while the `markdown-shortcuts-plugin` is awesome and battle-tested there are a few opinionated things we wanted to do differently. Rather than bother [@ngs](https://github.com/ngs) with tons of PRs, we figured it'd be better to own that core part of our experience fully.

0 commit comments

Comments
 (0)