文章怎么发 使用掘金:✏️ 如何使用掘金编辑器写文章
掘金 编辑器
我们建议掘友使用 编辑器来写作文章
掘金 编辑器整合了 标准语法,可以看官方文档
新的改变
工欲善其事,必先利其器。
为了让掘友们更好的创作出优秀的内容,我们针对大家对编辑器的反馈和建议,我们对编辑器进行了全新改造,增加诸多功能拓展与语法支持,除了标准的编辑器功能,我们增加了如下几点新功能,期待您更好的创作。
全新的界面设计 ,将会带来全新的写作体验;全新的 LaTeX数学公式 语法;新增 主题样式和代码高亮, 主题和代码样式可以自己去选择高亮样式;支持更多的图表;增加了 多屏幕编辑 文章功能;修复和增加了 写作模式、预览模式、左右区域同步滚轮设置 等功能;
编辑器第一个版本主要是优化了一些历史体验问题和新增了一些大家常用功能,更多的功能支持还请期待后续版本的更新。
掘金编辑器开源贡献地址://b…
掘金编辑器主题开源贡献地址:/xitu/…
功能快捷键
功能快捷键后续会迭代,暂时支持如下粗体: Ctrl/ +B
斜体: Ctrl/ +I
Ctrl/ + K
图片: Ctrl/ + Shift +I
有序列表: Ctrl/+shift +O
无序列表: Ctrl/+shift +U
代码: Ctrl/ + Shift +K
代码块: Ctrl/ + Shift + C
标题
语法:
# 第一级标题 ``
## 第二级标题 ``
###### 第六级标题 ``
展示效果如下:
第一级标题第二级标题第六级标题文本样式
语法:
**掘金编辑器上线了**
*掘金编辑器上线了*
掘金编辑器快捷键为:CMD + B 、CMD + I
掘金编辑器上线了
掘金编辑器上线了
列表无序列表
语法快捷键为:Ctrl/+shift +U
效果如下:
有序列表
语法快捷键为:Ctrl/+shift +O
效果如下:
项目一项目二项目三任务列表(Task lists)
语法:
- [ ] 任务一 未做任务 `- + 空格 + [ ]`
- [x] 任务二 已做任务 `- + 空格 + [x]`
效果如下:
图片
语法:

Ctrl/ + Shift +I可插入语法。除此之外,还可以用拖放图片、CMD + V粘贴这两种方式来增加图片。效果如下:
链接
语法:
[这里是掘金技术社区](https://juejin.cn/)
Ctrl/ + K可插入语法。
这里是掘金技术社区
行内代码
语法:
像这样即可:`` `world`
Ctrl/ + Shift +K可插入语法。效果如下:
像这样即可: world
多行或者一段代码
语法:
```js
for (var i = 1; i <= 5; i++) {
(function(j) {
setTimeout(function timer() {
console.log(j);
}, j * 1000);
})(i);
}
Ctrl/ + Shift + C可插入语法。效果如下:
for (var i = 1; i <= 5; i++) {
(function(j) {
setTimeout(function timer() {
console.log(j);
}, j * 1000);
})(i);
}
代码高亮
目前我们支持100多种代码高亮样式,可以使用 .js 中的所有样式:所有样式:
表格
一个简单的表格是这么创建的:
项目Value
电脑
$100
手机
$10
鼠标
$1
设定内容居中、居左、居右
使用:---------:居中
使用:----------居左
使用----------:居右
语法:
| 第一列 | 第二列 | 第三列 |
|:-----------:| -------------:|:-------------|
| 第一列文本居中 | 第二列文本居右 | 第三列文本居左 |
效果如下:
第一列第二列第三列
第一列文本居中
第二列文本居右
第三列文本居左
删除线
语法:
加删除线像这样用: ~~删除这些~~
效果如下:
加删除线像这样用:删除这些
分隔线
以下三种方式都可以生成分隔线:
***
*****
- - -
效果如下:
KaTeX数学公式
您也可以访问 参考更多使用方法。
行内公式:
这是一个行内公式 $E=mc^2$ 您学废了吗?
效果如下:
这是一个行内公式 E=mc2E=mc^2E=mc2 您学废了吗?
块级公式:
$$
x = dfrac{-b pm sqrt{b^2 - 4ac}}{2a}
$$
效果如下:
x=−b±b2− = dfrac{-b pm sqrt{b^2 - 4ac}}{2a}x=2a−b±b2−4ac
您可以找到更多关于的信息 LaTeX 数学表达式地址
顺序图或流程图
您可以使用生成各类图表。更多语法可以参考
甘特图
```mermaid
gantt
title A Gantt Diagram
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
section Another
Task in sec :2014-01-12 , 12d
another task : 24d```
gantt
title A Gantt Diagram
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
section Another
Task in sec :2014-01-12 , 12d
another task : 24d
流程图
```mermaid
graph TD
Start --> Stop```
graph TD
Start --> Stop
时序图
```mermaid
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!```
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!
类图
```mermaid
classDiagram
Animal <|-- Duck
Animal <|-- Fish
Animal <|-- Zebra
Animal : +int age
Animal : +String gender
Animal: +isMammal()
Animal: +mate()
class Duck{
+String beakColor
+swim()
+quack()
}
class Fish{
-int sizeInFeet
-canEat()
}
class Zebra{
+bool is_wild
+run()
}```
classDiagram
Animal <|-- Duck
Animal <|-- Fish
Animal <|-- Zebra
Animal : +int age
Animal : +String gender
Animal: +isMammal()
Animal: +mate()
class Duck{
+String beakColor
+swim()
+quack()
}
class Fish{
-int sizeInFeet
-canEat()
}
class Zebra{
+bool is_wild
+run()
}
状态图
```mermaid
stateDiagram-v2
[*] --> Still
Still --> [*]
Still --> Moving
Moving --> Still
Moving --> Crash
Crash --> [*]```
stateDiagram-v2
[*] --> Still
Still --> [*]
Still --> Moving
Moving --> Still
Moving --> Crash
Crash --> [*]
饼状图
```mermaid
pie title Pets adopted by volunteers
"Dogs" : 386
"Cats" : 85
"Rats" : 15```
pie title Pets adopted by volunteers
"Dogs" : 386
"Cats" : 85
"Rats" : 15
关系图
```mermaid
erDiagram
CUSTOMER ||--o{ ORDER : places
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses```
erDiagram
CUSTOMER ||--o{ ORDER : places
ORDER ||--|{ LINE-ITEM : contains
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
旅程图
```mermaid
journey
title My working day
section Go to work
Make tea: 5: Me
Go upstairs: 3: Me
Do work: 1: Me, Cat
section Go home
Go downstairs: 5: Me
Sit down: 5: Me```
journey
title My working day
section Go to work
Make tea: 5: Me
Go upstairs: 3: Me
Do work: 1: Me, Cat
section Go home
Go downstairs: 5: Me
Sit down: 5: Me
掘金富文本编辑器
除了 编辑器之外,我们了解到部分掘金用户是公司的 HR、产品经理或者其他岗位,因此我们也支持富文本功能。
特别注意,在切换编辑器时,当前编辑器内内容可能丢失,请务必备份并看清提示语句
草稿
在掘金里写文章时,我们的编辑器会自动保存您的内容并且可以在草稿中找到:
特别注意的是,草稿一经发布无法再转为草稿。
语法说明