Hexo的主题和使用

Manage

Welcome to Hexo!

This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
$ hexo new "My New Post"

More info: Writing

Run server

1
$ hexo server

More info: Server

Generate static files

生成静态文件

1
$ hexo generate

More info: Generating

Deploy to remote sites

部署到远程站点

1
$ hexo deploy

More info: Deployment

See also Hexo 教程：

w3cschool Hexo 中文文档

Hexo系列 | Hexo的基本使用

浅析 Hexo 搭建博客的原理

Hexo浅析原理

hexo的许多功能需要安装插件来实现

hexo博客添加本地搜索功能

2.Hexo插件

郁明敏收藏归纳的Hexo插件

思维导图插件

hexo-simple-mindmap

流程图插件

hexo-filter-flowchart

This plugin is based on flowchart.js, so you can defined the chart as follow

3.hexo主题

ocean主题

更新

1
2
3
4
$ cd themes/ocean

$ git pull

文章置顶

1
2
$ npm uninstall hexo-generator-index --save
$ npm install hexo-generator-index-pin-top --save
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
---
 title: 新增文章置顶
 author: zhwangart
 date: 2019-07-18 15:45:03
 top: ture
 

 layout: false  ## 不需要渲染
 toc: false ## 假设并不需要toc

 photos: [
 		["img_url"],
 		[]
 		]
---

文章自动添加Read More

将\themes\ocean\layout_partial\article.ejs文中的<% if (post.excerpt && index){ %>的else部分替换为如下内容：

1
2
3
4
5
6
7
8
9
10
<% var br = post.content.indexOf('<br>') %>
<% if(br < 0 || !index) { %>
  <%- post.more %>
<% } else { %>
  <%- post.content.substring(0, br) %><br/>
  <% if (theme.excerpt_link) { %>
	<a class="article-more-link" href="<%- url_for(post.path) %>"><%= theme.excerpt_link %></a>
  <% } %>
<% } %>

next主题

首页

文章

分类

代码高亮

Tomorrow:

#ffffff Background
#efefef Current Line
#d6d6d6 Selection
#4d4d4c Foreground
#8e908c Comment
#c82829 Red
#f5871f Orange
#eab700 Yellow
#718c00 Green
#3e999f Aqua
#4271ae Blue
#8959a8 Purple

Tomorrow Night:

#1d1f21 Background
#282a2e Current Line
#373b41 Selection
#c5c8c6 Foreground
#969896 Comment
#cc6666 Red
#de935f Orange
#f0c674 Yellow
#b5bd68 Green
#8abeb7 Aqua
#81a2be Blue
#b294bb Purple

Tomorrow Night Eighties:

#2d2d2d Background
#393939 Current Line
#515151 Selection
#cccccc Foreground
#999999 Comment
#f2777a Red
#f99157 Orange
#ffcc66 Yellow
#99cc99 Green
#66cccc Aqua
#6699cc Blue
#cc99cc Purple

Tomorrow Night Blue

#002451 Background
#00346e Current Line
#003f8e Selection
#ffffff Foreground
#7285b7 Comment
#ff9da4 Red
#ffc58f Orange
#ffeead Yellow
#d1f1a9 Green
#99ffff Aqua
#bbdaff Blue
#ebbbff Purple

Tomorrow Night Bright

#000000 Background
#2a2a2a Current Line
#424242 Selection
#eaeaea Foreground
#969896 Comment
#d54e53 Red
#e78c45 Orange
#e7c547 Yellow
#b9ca4a Green
#70c0b1 Aqua
#7aa6da Blue
#c397d8 Purple

wind主题

使用小图标

1
2
3
4
archives:
  link: "/archives"    
  icon: "fa fa-file-text-o"

Butterfly

Butterfly 官方教程

基于 Butterfly 主题魔改的样式查阅

hexo 插件

思维导图插件

hexo-simple-mindmap

流程图插件

hexo-filter-flowchart

This plugin is based on flowchart.js, so you can defined the chart as follow