NotionNext

NotionNext 是一个使用 NextJS + Notion API 实现的静态博客系统，只要在 Notion 写好文章就会自动同发布为静态博客，从而专注于写作、而不需要操心网站的维护。
文档

Docusaurus

中文网站

1
2
3
##快速简单地安装 Docusaurus 并搭建网站框架（包含模板文件），开启 Typescript 支持
npx create-docusaurus@latest my-website classic --typescript
npm start

Hexo

1
2
3
4
5
6
7
8
9
10
11
npm install hexo-cli -g
hexo -v
hexo init Library
cd Library
npm install
npm install hexo-theme-butterfly
npm update hexo-theme-butterfly
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
# 主题
https://github.com/XPoet/hexo-theme-keep
https://github.com/theme-shoka-x/hexo-theme-shokaX

升级

1
2
npm install -g npm-check-updates
ncu -u

安装插件

如果你没有 pug 以及 stylus 的渲染器，请下载安装：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
npm install hexo-renderer-pug hexo-renderer-stylus --save
npm install hexo-wordcount --save
npm install hexo-abbrlink --save
npm install hexo-generator-search --save
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save
npm install hexo-generator-index-pin-top --save
npm install hexo-generator-feed --save
npm install hexo-filter-nofollow --save
npm install hexo-steam-games --save
npm install hexo-reference --save
npm install hexo-butterfly-swiper --save
npm install hexo-footnotes --save
npm install hexo-butterfly-article-double-row --save
npm install hexo-tag-map --save
npm install hexo-butterfly-tag-plugins-plus --save

轮播
1
2
3
4
5
6
7
8
9
10
11
12
13
14
swiper:
  enable: true # 开关
  priority: 5 #过滤器优先权
  enable_page: all # 应用页面
  timemode: date #date/updated
  layout: # 挂载容器类型
    type: id
    name: recent-posts
    index: 0
  default_descr: 再怎么看我也不知道怎么描述它的啦！
  swiper_css: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.css #swiper css依赖
  swiper_js: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper.min.js #swiper js依赖
  custom_css: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiperstyle.css # 适配主题样式补丁
  custom_js: https://npm.elemecdn.com/hexo-butterfly-swiper/lib/swiper_init.js # swiper初始化方法

外挂标签
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# tag-plugins-plus
# see https://akilar.top/posts/615e2dec/
tag_plugins:
  enable: true # 开关
  priority: 5 #过滤器优先权
  issues: false #issues标签依赖注入开关
  link:
    placeholder: /img/link.png #link_card标签默认的图标图片
  CDN:
    anima: https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/font-awesome-animation.min.css #动画标签anima的依赖
    jquery: https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js #issues标签依赖
    issues: https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/issues.js #issues标签依赖
    iconfont: //at.alicdn.com/t/font_2032782_8d5kxvn09md.js #参看https://akilar.top/posts/d2ebecef/
    carousel: https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/assets/carousel-touch.js
    tag_plugins_css: https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@latest/lib/tag_plugins.css

hexo 自带的 markdown 渲染插件 hexo-renderer-marked 与外挂标签语法的兼容性较差，建议将其替换成 hexo-renderer-kramed
1
2
npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save

文章双栏布局：安装 hexo-butterfly-article-double-row 插件，然后 _config.yml 新增配置项：
1
2
butterfly_article_double_row:
  enable: true

添加翻页样式
1
2
3
4
5
/* 翻页按钮居中 */
#pagination {
    width: 100%;
    margin: auto;
}

地图
1
2
{% + 标签值 + 经度 + 纬度 + 文本 + 缩放等级 + 宽 + 高 + 默认图层 + %}
{% map 120.101101,30.239119, 这里是西湖灵隐寺，据说求姻缘很灵验哦！, 15, 100%, 360px, 1 %}

| 地图名 | 标签值| 经度| 纬度| 文本 | 缩放等级(14) | 宽(100%) | 高 (360px) | 图层 (1) |
| ———————- | ——————- | ———————- | ——————- | —— | ————————- | ——————— | ———————- | ————————- |
| 混合地图 | map | -180~180 | -90~90 | 文本 | 3~18 | 百分数或具体值 | 百分数或具体值 | 1~7 |
| 谷歌地图 | googleMap | -180~180 | -90~90 | 文本 | 1~20 | 百分数或具体值 | 百分数或具体值 | 1~3 |
| 高德地图 | gaodeMap | -180~180 | -90~90 | 文本 | 3~18 | 百分数或具体值 | 百分数或具体值 | 1~3 |
| 百度地图 | baiduMap | -180~180 | -90~90 | 文本 | 4~18 | 百分数或具体值 | 百分数或具体值 | 1~2 |
| Geoq 地图 | geoqMap | -180~180 | -90~90 | 文本 | 1~18 | 百分数或具体值 | 百分数或具体值 | 1~5 |
| Openstreet 地图 | openstreetMap | -180~180 | -90~90 | 文本 | 1~18 | 百分数或具体值 | 百分数或具体值 | 不支持此参数 |