Hexo 笔记

部分页面相关数据调用方式

该文章发布时间

<%= date(post.date, 'MM-DD') %>

文章路径含域名

<%= post.permalink %>

文章路径不含域名，完整相对路径

<%= url_for(post.path) %>

文章路径不含域名，只提取文章路径

<%= post.path %>

归档相对年链接

<%= url_for("/archives/" + year + "/") %>

文章标题

<%= post.title %>

没有填写标题时默认显示

<%= post.title || 'Untitled' %>

<%= post.content
    .replace(/<[^>]*>/ig, ' ')
    .substr(0, 50) %>

<% if(post.categories.data[0]){ %>
    <a class="category-link" href="<%= url_for(post.categories.data[0].path) %>"><i class="fa fa-folder-open"></i> <%= post.categories.data[0].name %></a>
<% } else { %>
    <i class="fa fa-folder-open"></i> <%= 'Uncategorized' %>
<% } %>

<%= post.tags.length %>

获取最新60篇内容

<%
var posts = page.posts.data;
var recentPosts = page.posts.data.slice(0, 60);
%>
<% recentPosts.forEach(function(post){ %>
<li>
    <a href="<%= url_for(post.path) %>"><%= post.title %></a>
</li>
<% }) %>

静态资源增加时间后缀

  <%- css(['css/style.css' + '?v=' + date(Date.now(), 'YYYYMMDDHms')]) %>

pinwu 转移内容

安装

先安装环境相关软件

安装hexo

npm install -g hexo-cli

打补丁修复BUG

npm audit fix

mac xos 无法安装解决方法

加上sudo执行，按回车，输入机器密码即可（如果还是不行多试试，可能还是会报错，我是已经创建好从windows拷贝过来，试了试能执行hexo g之类的命令）。

sudo npm install -g hexo-cli

摘自：npm install 总是报错(Mac OS环境下)

如果还是不行，先检查下node、git是否正常安装，查看版本 node -v git --v

安装好后，打开要存放hexo文件的目录，在空白处按住Shift单击右键，选择【在此处打开命令窗口】然后执行一下命令 <folder>为你要存放hexo的文件夹，可以事先建立

$ hexo init <folder>
$ cd <folder>
$ npm install

创建好后可以在_config.yml文件中设置博客的相关信息。

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

$ hexo new "My New Post"

More info: Writing

Run server

$ hexo server

More info: Server

Generate static files

$ hexo generate

More info: Generating

Deploy to remote sites

$ hexo deploy

More info: Deployment

发布

参数	说明	值
layout	布局	post、page、draft
title	标题
date	建立日期	文件建立日期
updated	更新日期	文件更新日期
comments	开启文章的评论功能	true
tags	标签（不适用于分页）
categories	分类（不适用于分页）
permalink	覆盖文章网址

多个标签

tags:
- PS3
- Games

子分类

不可设置多分类

categories:
- Diary
- Life

自定义链接（Permalinks）

网站根目录

網站存放在子目錄
如果您的網站存放在子目錄中，例如 http://example.org/blog，請將您的 url 設為 http://example.org/blog 並把 root 設為 /blog/。

文章链接

變數  描述
:year   文章的發表年份（4 位數）
:month  文章的發表月份（2 位數）
:i_month    文章的發表月份（去掉開頭的零）
:day    文章的發表日期 (2 位數)
:i_day  文章的發表日期（去掉開頭的零）
:title  檔案名稱
:id 文章 ID
:category   分類。如果文章沒有分類，則是 default_category 設定。

演示多个分类
设置
categories:
- foo
- bar
效果
:category/:title    foo/bar/hello-world

文件不被模版渲染

source下的md和html文件不被模版渲染生成

---
layout: false
---

整个目录不被渲染修改根目录_config.yml文件中skip_render。（假设projects为source目录下的文件夹）

skip_render: projects/**

插件

安装或移除插件

# hexo安装xxx插件
npm install xxx –save
# hexo卸载xxx插件
npm uninstall xxx

hexo-generator-amp

https://github.com/tea3/hexo-generator-amp

自动生成 AMP，普通链接为 http://localhost:4000/posts/ AMP 链接为 http://localhost:4000/posts/amp/，另外需要在模板 head 文件配置 AMP 链接。

支持选择 AMP 模板，支持谷歌广告。

hexo-external-link

https://github.com/hvnobug/hexo-external-link

自动为 a 标签外链增加 target='_blank', rel='external nofollow noopener noreferrer' 属性，并且可以自定义，还可以生成外链跳转页面 go.html。好像没有白名单功能。

安装

npm install hexo-external-link --save

hexo-autonofollow

https://github.com/liuzc/hexo-autonofollow

自动将 nofollow 相关属性 rel="external nofollow" target="_blank" 添加到文章中的外部链接，可以设置白名单

安装

npm install hexo-autonofollow --save

hexo-filter-nofollow

https://github.com/hexojs/hexo-filter-nofollow

自动将 nofollow 相关属性 rel="noopener external nofollow noreferrer"，可以设置白名单

安装

npm i hexo-filter-nofollow --save

###

hexo-abbrlink2

https://github.com/rozbo/hexo-abbrlink2

自动生成 url ，自动以 ID（数字）递增，但是如果修改文件名会重新创建。

配置

permalink: posts/:abbrlink/

扩展配置

abbrlink:
  start: 1000 # 从多少开始，默认从 0 开始

生成演示

https://post.zz173.com/posts/1.html
https://post.zz173.com/posts/2.html
https://post.zz173.com/posts/3.html

hexo-abbrlink

https://github.com/rozbo/hexo-abbrlink

自动生成短链接，根据 crc16 或者 crc32 随机生成链接。

hexo-generator-random

https://github.com/Drew233/hexo-generator-random

随机打开一篇文章

插件必须依赖（前3个hexo一般已经集成）

minimatch
path
fs
object-assign

hexo-sitemap-generator

https://www.npmjs.com/package/hexo-sitemap-generator

安装

npm install hexo-sitemap-generator --save

在根目录 _config.yml 文件配置插件

sitemaps:
  path: 
    - sitemap.xml
    - sitemap.txt
    - sitemap.html
  # template: ./sitemap_template.xml
  # template_txt: ./sitemap_template.txt
  # template_html: ./sitemap_template.html
  rel: false
  tags: true
  categories: true

内容禁止添加到 sitemap 在内容 front matter 添加 sitemap: false

title: 页面找不到

sitemap: false

hexo-generator-alias

https://www.npmjs.com/package/hexo-generator-alias

安装

npm install hexo-generator-alias --save

根目录 _config.yml 文件配置指定页面URL的跳转

alias:
  about-page/index.html: about/
  site/github.html: https://github.com/

多个页面URL跳转到当前页面URL，配置 alias

---
title: 当前页面
alias: foo/index.html # 一个
 
alias: # 多个
- foo/index.html
- bar/index.html
--- 

当前页面跳转到其他页面，配置 redirect

--- 
title: 当前页面
redirect: http://1px.run/
--- 

主题

icarus

Icarus提供如下的内置CDN服务提供商：

JavaScript库CDN
- cdnjs.com 「5.1.0 实际用的是 https://cdnjs.cloudflare.com/ 」 (cdnjs)
- jsDelivr (jsdelivr)
- UNPKG (unpkg)
- loli.net (loli)
Web字体CDN
- Google Fonts (google)
- loli.net (loli)
- font.im (fontim)
- 中国科学技术大学 (ustc)
FontAwesome图标CDN
- FontAwesome 5 (fontawesome)
- loli.net (loli)

文章

发布时间

<%= date(post.date, 'YYYY-MM-DD H:m') %>

更新时间

<%= date(post.updated, 'YYYY-MM-DD H:m') %>

摘要

直接读取摘要，部分内容可能会导致布局错乱

核心代码：第2行

      <% if (post.excerpt && index){ %>
        <%- post.excerpt %>
        <% if (theme.excerpt_link){ %>
          <p class="article-more-link">
            <a href="<%- url_for(post.path) %>#more"><%= theme.excerpt_link %></a>
          </p>
        <% } %>
      <% } else { %>
      <!-- 其他状态 -->
      <% } %>

【好像会报错，还需验证】读取摘要时格式化内容，并限定字数

核心代码：第2行

      <% if (post.excerpt && index){ %>
        <p><%- truncate(strip_html(article.excerpt || article.content ), {length: 140}) %></p>
        <% if (theme.excerpt_link){ %>
          <p class="article-more-link">
            <a href="<%- url_for(post.path) %>#more"><%= theme.excerpt_link %></a>
          </p>
        <% } %>
      <% } else { %>
      <!-- 其他状态 -->
      <% } %>

调取自定义字段

<% if (post.siteurl){ %>
有<%= post.siteurl %>显示siteurl值
<% } else { %>
没有就显示其他这个
<% } %>

判断

<% if (post.indexfocus){ %>
文章配置indexfocus为true显示
<% } %>

页面判断

<% if (is_post()){ %>
<a class="<%= class_name %>" href="<%- url_for(post.path) %>" id="logo"><%= post.title %></a>文章、独立页面显示这里
<% } else { %>
<a href="<%- url_for() %>" id="logo"><%= config.title %></a>
其他页面显示这里
<% } %>

hexo 搜索

主题修改

常用模板函数

<%- url_for() %>网站地址 <%= config.title %>网站名称有副标题显示副标题

<% if (theme.subtitle){ %>
    <%= theme.subtitle %>
<% } %>

有rss就显示rss链接

<% if (theme.rss){ %>
          <a id="nav-rss-link" class="nav-icon" href="<%- url_for(theme.rss) %>" title="<%= __('rss_feed') %>"></a>
        <% } %>

列表函数配置方法举例 show_count使用模板函数，class使用输入值，相关配置值https://hexo.io/zh-cn/docs/helpers.html

<%- list_categories({show_count: theme.show_count, class: 'clearfix'}) %>

不同页面分别显示对应标题或者文字内容配置

  <%
  var pagetitle = page.title;

  if (is_archive()){
    pagetitle = __('archive_a');

    if (is_month()){
      pagetitle += ': ' + page.year + '年' + page.month + '月发布的文章';
    } else if (is_year()){
      pagetitle += ': ' + page.year + '年发布的文章';
    }
  } else if (is_category()){
    pagetitle = page.category;
  } else if (is_tag()){
    pagetitle = page.tag;
  } else if (is_home()){
    pagetitle = config.subtitle;
  }
  %>

使用<h2><%= pagetitle %></h2>

输出分类列表

        <% if (site.categories.length){ %>
        <% site.categories.sort('name').each(function(item){ %>
            <a class="main-nav-link nav-<%=item.slug%>" href="<%= url_for(item.path) %>">
                <strong class='name'><%= item.name %></strong>
                <span class='badget'><%= item.posts.length %></span>
            </a>
        <% }); %>
        <% } %>

只在首页显示

方法一

<% if (is_home()){ %>
    <!-- 这里写要在首页显示的内容 -->
<% } %>

方法二

<% if (index){ %>
    <!-- 这里写要在首页显示的内容 -->
<% } %>

不在首页显示

  <% if (!index){ %>
    这个不在首页显示
  <% } %>

开启代码高亮

http://jamling.github.io/2016/07/18/Web/Hexo-dev-highlight/

hexo 升级教程

https://cco.xyz/post/upgrade-hexo/

升级hexo

检查版本npm outdated，如果没有输出内容表示当前为最新版

指定版本，修改package.json文件中dependencies部分对应版本号

执行更新命令npm install --save

更新完成后执行当前版本命令hexo version，确认更新结果

将 Hexo 升级到 v3.5.0（升级到其他版本方法一致）

升级npm

更新 npm 版本npm install npm@latest -g 如果报错请使用root模式sudo -i

npm 版本更新指令

hexo 及 npm 管理

查看插件列表npm list

卸载指定插件npm uninstall hexo-qiniu-sync@1.4.7

删除文件夹rm -rf

列出网站资料hexo list

显示草稿hexo --draft