如何在html页面中添加Editor md插件
时间: 2023-01-11 13:55:36 浏览: 78
要在 HTML 页面中添加 Editor.md 插件,需要执行以下步骤:
1. 在页面中引入 Editor.md 的 CSS 和 JavaScript 文件:
```html
<!-- 引入 Editor.md 的 CSS 文件 -->
<link rel="stylesheet" href="path/to/editor.md/css/editormd.css" />
<!-- 引入 Editor.md 的 JavaScript 文件 -->
<script src="path/to/editor.md/lib/editormd.min.js"></script>
```
2. 在页面中添加一个用于编辑的 `<div>` 元素,并为其设置一个唯一的 `id`:
```html
<div id="editor">
这里是初始内容
</div>
```
3. 在页面中创建一个新的 `Editor.md` 实例,并将其绑定到刚才添加的 `<div>` 元素上:
```html
<script>
var editor = editormd("editor", {
// 这里是配置选项
});
</script>
```
4. 根据需要,可以调整配置选项来自定义 Editor.md 的行为。例如,可以调整工具栏的布局、启用或禁用特定的功能等。
示例代码:
```html
<div id="editor">
这里是初始内容
</div>
<link rel="stylesheet" href="path/to/editor.md/css/editormd.css" />
<script src="path/to/editor.md/lib/editormd.min.js"></script>
<script>
var editor = editormd("editor", {
// 调整工具栏的布局
toolbarIcons: function() {
return [
"bold", "italic", "quote", "|",
"list-ul", "list-ol", "hr", "|",
"link", "image", "|",
"watch", "preview", "fullscreen"
]
},
// 启用上传图片功能