0%

Hexo 搭建系列 - 在BLOG中插入Emoji表情

🍑 🍇 🍐 🍓 🍌 🍉 🍍 🍋 🍎

HEXO預設的markdown渲染器是hexo-renderer-marked,這個渲染器並不支援插件擴展,所以我們需要卸載它改裝hexo-renderer-markdown-it

而hexo-renderer-markdown-it 原裝包含了以下插件:
- markdown-it-abbr
- markdown-it-footnote
- markdown-it-ins
- markdown-it-sub
- markdown-it-sup

並不包含emoji插件,因此我們還要安裝markdown-it-emoji來插入表情。

安裝

STEP 1

首先卸載hexo-renderer-marked然後再安裝hexo-renderer-markdown-it。

1
2
npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-markdown-it --save

STEP 2

安裝markdown-it-emoji:

1
npm install markdown-it-emoji --save

STEP 3

打開 config.yml 加入以下內容:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
markdown:
render:
html: true
xhtmlOut: false
breaks: true
linkify: true
typographer: true
quotes: '“”‘’'
plugins:
- markdown-it-abbr
- markdown-it-footnote
- markdown-it-ins
- markdown-it-sub
- markdown-it-sup
- markdown-it-emoji
anchors:
level: 2
collisionSuffix: 'v'
permalink: true
permalinkClass: header-anchor
permalinkSymbol: ''

STEP 4

使用方法:在 emoji-cheat-sheet 中查找想貼上的表情,例如 💥
則直接在文章中對應編碼 :boom: 就能顯示。

參考資料

hexo-renderer-markdown-it

------------ 本文結束 ------------

【版權聲明】
本文鏈接: https://zenreal.github.io/posts/25926/
本文為博主(ZEN)原創文章,遵循CC BY-NC-SA 4.0 版權協議,轉載請附上原文出處鏈接和本聲明。