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

该文章发布时间

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

文章路径 含域名

<%= post.permalink %>

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

<%= url_for(post.path) %>

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

<%= post.path %>

归档相对年链接

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

文章标题

<%= post.title %>

当前文章的分类（文字链接和别名）

其中 <%= category.slug %> 为别名，也就是url路径中的目录名称

<% post.categories.forEach(category => { %>
  <a href="<%- url_for(category.path) %>" class="category category-<%= category.slug %>"><%= category.name %></a>
<% }); %>

没有填写标题时默认显示

<%= 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

hexo 所需环境

先安装环境相关软件

• Node.js
• Git （可选）

安装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（新建站点项目）

安装好 node.js 后，打开要存放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.

git clen 项目直接安装（更新所需组件）

npm install

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 替换为插件的 name ，可在 package.json 文件中查看

npm install xxx –save

hexo 卸载插件

查看已安装插件

npm list

将 xxx 替换为插件的 name ，可在 package.json 文件中查看，也可以在刚刚查询到的已安装插件列表中获得

npm uninstall xxx

主题

• 推荐主题

文章

发布时间

<%= 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显示
<% } %>

判断当前列表的分类按分类显示不同内容

• 用途
  • 在分类列表，为每一条分类撰写一段分类介绍

以下示例，如果当前列表的分类是像素笔记就添加这段行内样式（也可以替换其他任意内容） 用分类名称name判断，将像素笔记替换为特定分类名称

<% if (is_category('像素笔记')) { %> style="columns: 600px;" <% } %>

判断分类同时包含多个分类

<% if (is_category('网页截图' | 'APP截图')) { %> style="columns: 600px;" <% } %>

判断当前文章所属分类按分类显示不同内容

这段代码可以在文章页模板使用，也可以在首页、归档等列表页使用(需发到列表内)

• 用途
  • 为不同的分类的内容在文章页补充不同的内容
  • 为不同的分类在列表、内容页制定不同的风格样式

用分类名称name判断，将像素笔记替换为特定分类名称

<% post.categories.forEach(category => { %>
	<% if (category.name == '像素笔记') { %>
		这是像素笔记的内容
	<% } %>
<% }); %>

用分类别名slug判断，将1px-run替换为特定分类的别名

<% post.categories.forEach(category => { %>
	<% if (category.slug == '1px-run') { %>
		这是像素笔记的内容
	<% } %>
<% }); %>

layout 模板判断

layout 的值可以是任意内容，但是要和文章或页面的 layout 值对应

<% if(post.layout == 'page'){ %>
  如果 layout 为 page 显示这些内容
<% } %>

页面和文章页判断

<% 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>
其他页面显示这里
<% } %>

更多页面判断

is_current

检查 path 是否符合目前页面的网址。开启 strict 选项启用严格比对。

<%- is_current(path, [strict]) %>

is_home

检查当前页面是否为首页。

<%- is_home() %>

is_home_first_page (+6.3.0)

检查当前页面是否为首页的第一页。

<%- is_home_first_page() %>

is_post

检查当前页面是否为文章。

<%- is_post() %>

is_page

检查当前页面是否为独立页面。

<%- is_page() %>

is_archive

检查当前页面是否为存档页面。

<%- is_archive() %>

is_year

检查当前页面是否为年度归档页面。

<%- is_year() %>

is_month

检查当前页面是否为月度归档页面。

<%- is_month() %>

is_category

检查当前页面是否为分类归档页面。 如果给定一个字符串作为参数，将会检查目前是否为指定分类。

<%- is_category() %>
<%- is_category('hobby') %>

is_tag

检查当前页面是否为标签归档页面。 如果给定一个字符串作为参数，将会检查目前是否为指定标签。

<%- is_tag() %>
<%- is_tag('hobby') %>

hexo 搜索

• Hexo添加站内搜索功能初步完成
• 让 Hexo 博客支持本地站内搜索

主题修改

• Hexo 官方主题 landscape-plus 优化
• Hexo 自动添加 Read More 标记
• 为Hexo添加文章目录
• 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 及 npm 管理

查看插件列表npm list

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

删除文件夹rm -rf

列出网站资料hexo list

显示草稿hexo --draft

相关教程

• Hexo官方文档

• 使用LeanCloud平台为Hexo博客添加文章浏览量统计组件
• Hexo添加字数统计、阅读时长
• Hexo搭建Github-Pages博客填坑教程
• hexo安装与卸载插件
• 在 Hexo 中创建匹配主题的404页面
• Hexo Docs（三）- 高级进阶 - 简书
• 辅助函数（Helpers）

---

Table of contents

• Hexo 主题模板推荐
• Hexo 升级到最新版或更新到指定版本
• Hexo 精选插件推荐