安装 blog-admin 博客插件

发表于 更新于 分类于

安装 hexo

安装

brew install node
npm install hexo-cli --no-optional -g
hexo init blog && cd blog
git clone https://github.com/iissnan/hexo-theme-next.git theme/next
npm install https://github.com/CodeFalling/hexo-renderer-org\#emacs --save
npm install hexo-deployer-git --save
npm install hexo-renderer-org --save
# 在org-mode下插入图片[[./article-title/image.png]],
# 生成后图片路径需要替换
# 替换node_modules/hexo-renderer-org/lib/renderer.js的parse_output函数
# 在out = whole[1]下面添加替换语句
#   out = out.replace(/img src=".\//g, 'img src="../')

配置

  • 配置 next 主题 

    grep theme  _config.yml
  ## Themes: https://hexo.io/themes/
  #theme: landscape
  theme: next

  • 配置 hexo-renderer-org，通过 org 写博客 

    grep -A5 org: _config.yml
org:
emacs: '/Applications/Emacs.app/Contents/MacOS/Emacs'
common: |
    #+OPTIONS: toc:nil
    #+BIND: org-html-postamble \"Last Updated %C.</br>Render by <a href='https://github.com/CodeFalling/hexo-renderer-org'>hexo-renderer-org</a> with %c\"
    cachedir: './hexo-org-cache/'

  • 配置 swiftype 搜索 

    grep -A2 Swiftype _config.yml
  # Swiftype Search Key
  swiftype_key: XXXXXXXXXXX

  • 配置 github 发布 

    grep -A2 deploy: _config.yml
deploy:
  type: git
  repo: https://github.com/keychar/keychar.github.io

生成、测试和部署

hexo g
hexo s
open http://127.0.0.1:4000
hexo d

在 org 中插入 more 按钮

#+HTML: <!-- more -->

使用 blog-admin

如何添加本地搜索

执行如下命令安装 search 引擎

npm install hexo-generator-search --save

在~/blog/config.yml 添加如下配置

search:
  path: search.xml
  field: post

如何使用搜索

安装 algolia

npm install hexo-algolia --save

配置config.yml

algolia:
  applicationID: '****'
  apiKey: '**********'
  adminApiKey: '**********'
  indexName: 'hexo'
  chunkSize: 5000

生成索引

hexo algolia

表格示例

学号 姓名 年级
1234 张晓晓 一年级
1235 张要要 二年级
1235 张不不 三年级

代码示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
/**
 * @file main.c
 * @brief Print "Hello world" to screen
 * @author evans
 * @version 1.0
 * @date 05/29/2016 16:31:39, 21th Sunday
 * @par Copyright:
 * Copyright (c) www.keychar.com 2016. All rights reserved.
 */



#include    <stdio.h>
#include    <stdlib.h>


/**
 * @brief The entry of this program
 *
 * @param argc counts of argument
 * @param argv argument variables stored in
 *
 * @return EXIT_SUCCESS
 */
int main (int argc, char **argv)
{
    printf("Hello world\n");
    return EXIT_SUCCESS;
}       //end of function main

如何添加标签和分页

在 blog 目录执行如下目录

1
2
hexo new page tags
hexo new page categories

编辑~/blog/source/tags/index.md, 添加 type: tags

1
2
3
4
5
6
cat source/tags/index.md
---
title: tags
date: 2016-05-29 07:07:13
type: tags
---

编辑~/blog/source/categories/index.md, 添加 type: categories

1
2
3
4
5
6
cat ~/blog/source/categories/index.md
---
title: categories
date: 2016-05-29 07:17:43
type: categories
---

如何修改 search 对话框的按钮，改为 X 图标

编辑

  • 修改'<span class="popup-btn-close">Close</span>'为'<span class="popup-btn-close search-icon fa fa-close"></span>' 

    1
    2
    3
    4
    5
    6
    7
    cat themes/next/layout/_partials/search/localsearch.swig
    <div class="popup">
     <span class="search-icon fa fa-search"></span>
     <input type="text" id="local-search-input">
     <div id="local-search-result"></div>
     <span class="popup-btn-close search-icon fa fa-close"></span>
    </div>

  • 修改颜色为红色, color: #FC6423; 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    grep -A 10 'popup-btn-close' ./themes/next/source/css/_common/components/third-party/localsearch.styl
    .popup-btn-close {
        position: absolute;
        top: 6px;
        right: 14px;
        color: #FC6423;
        font-size: 14px;
        font-weight: bold;
        text-transform: uppercase;
        cursor: pointer;
    }

如何添加引用(Hexo NexT)


#+BEGIN_QUOTE
Everything should be made as simple as possible,
but not any simpler -- Albert Einstein
#+END_QUOTE

Everything should be made as simple as possible, but not any simpler – Albert Einstein 


#+BEGIN_HTML
{% blockquote @DevDocs https://twitter.com/devdocs/status/356095192085962752 %}
NEW: DevDocs now comes with syntax highlighting. http://devdocs.io
{% endblockquote %}
#+END_HTML

NEW: DevDocs now comes with syntax highlighting. http://devdocs.io


#+BEGIN_HTML
{% note %}
Node stlye note
{% endnote %}
#+END_HTML

Node stlye note


#+BEGIN_HTML
{% note default %}
Default Node
{% endnote %}
#+END_HTML

Default Node


#+BEGIN_HTML
{% note primary %}
Primary Note
{% endnote %}
#+END_HTML

Primary Note


#+BEGIN_HTML
{% note info %}
Info Note
{% endnote %}
#+END_HTML

Info Note


#+BEGIN_HTML
{% note success %}
Sucess Note
{% endnote %}
#+END_HTML

Sucess Note


#+BEGIN_HTML
{% note warning %}
Warning Note
{% endnote %}
#+END_HTML

Warning Note


#+BEGIN_HTML
{% note danger %}
Danger Note
{% endnote %}
#+END_HTML

Danger Note

升级 hexo

1
2
3
4
5
6
7
mv themes/next themes/next.bck
git clone --branch v8.11.1  https://github.91chi.fun//https://github.com/next-theme/hexo-theme-next themes/next
rm -fr package-lock.json node_module
npm install -g npm-check-updates
ncu # 查看可更新包
ncu -u # 更新package.json
npm install # 升级到最新版本