hexo 是一款快速、简单、并且强大的博客博客模板框架 - 基于nodejs 。

特点

  • 基于nodejs
  • 使用Markdown书写文章
  • 无需数据库
  • 可以使用GitHub Pages发布

要用到的模块

  • node.js
  • hexo
  • git
  • 多说

git需要提前安装,hexo init的时候用到。

安装Nodejs

下载地址: http://nodejs.org/download/

验证node和npm是否安装成功(由于新版的NodeJS已经集成了npm),在cmd中输入

node -v
npm -v

出现版本号就是正确安装了。

安装hexo

安装hexo,-g表示全局安装。

npm install -g hexo

如果有warn可以不用管。

初始化一个博客

选择一个常用的目录(不要有中文或者空格),初始化一个博客应用:

hexo init

文件夹自动生成建网站所需的文件。

cd blog
npm install

会在文件夹下安装node_modules依赖。

本地测试

hexo server

然后就可以http://localhost:4000/ 中打开了

记得关server是ctrl+c

此时文件目录为:

.deploy_git
node_modules nodejs 相关依赖
public 自动生成的静态html目录
scaffolds 脚手架 - 也就是一个工具模板
source 存放markdown文章目录
themes 存放皮肤的地方
_config.yml 配置文件
CNAME github域名绑定文件
db.json 数据
package.json 配置依赖

新建文章

在blog根目录下我们可以通过 hexo new <title> 命令来实现新建文章。

例如我们想新建一篇主题为hello的blog:

hexo new hello

hexo会在 source/_posts/ 下新建hello.md 文件。

编辑 hello.md 就是编辑你的blog内容了 — markdown语法

hello.md 的文档和目录可以这样添加:

title: hexo、github、多说、搭建免费博客
date: 2014-10-19 12:56:58
tags:
- tag1
- tag2
- tag3
categories:
- 目录
--- // 你的内容
<!--more--> // 以上为摘要

我们也可以手动在source/_posts/ 下新建md 文件。

更换主题

主题目录:themes/

在此目录放置主题,并在根目录的_config.yml更改

theme: landscape

即可。

部署到github

初步准备

安装git :

下载地址:http://msysgit.github.io/

github上创建账号

去https://github.com/注册账号,并建立repository

建立仓库名必须是XXX.github.io。每个用户可以建立一个与用户名一致的XXX.github.io特殊仓库。

部署

部署到github 非常简单。因为hexo已经为你集成好了发布到github的配置。

我们只需要 修改 blog 目录下的 _config.yml 文件。

打开 _config.yml 找到如下配置:

# 部署配置
deploy:
type: git
repo: git@github.com:xxx/xxx.github.io.git
branch: master

回到 blog 目录 执行

hexo g
hexo d

你会发现public 目录下的页面已经发布到github gh-pages 分支了。往后我们要做的就是用自己的域名指向 github。

设置独立域名

默认的域名是xxx.github.io。自己如果有域名,可以绑定。

例如 我的域名为 blog.me

1 我们要在github blog项目下新建一个CNAME文件 内容为 blog.me

2 将我们得域名A 记录到 207.97.227.245 这个ip

域名解析完成后我们 blog.me 就是我们的blog了。支持子域名。207.97.227.245为github指定绑定的域名。

插件安装

多说

评论插件多说为hexo量身打造了一套解决方案。

查看教程

站点创建地址

rss

rss的安装非常简单 ,已经有人做好了插件,安装只需一步。

npm install hexo-generator-feed

启动服务器,用浏览器打开 http://localhost:4000/atom.xml, 就可以看到RSS已经生效了。

sitemap

同样是一条命令,就可以完成。

npm install hexo-generator-sitemap

启动服务器,用浏览器打开 用浏览器打开 http://localhost:4000/sitemap.xml 发现site已经生效。

命令概览

清除缓存,解决很多奇怪问题

hexo clean

hexo安装升级

npm install hexo -g #安装
npm update hexo -g #升级
hexo init #初始化

简写

hexo n "我的博客" == hexo new "我的博客" #新建文章
hexo p == hexo publish
hexo g == hexo generate#生成
hexo s == hexo server #启动服务预览
hexo d == hexo deploy#部署

服务器

hexo server #Hexo 会监视文件变动并自动更新,您无须重启服务器。
hexo server -s #静态模式
hexo server -p 5000 #更改端口
hexo server -i 192.168.1.1 #自定义 IP hexo clean #清除缓存 网页正常情况下可以忽略此条命令
hexo g #生成静态网页
hexo d #开始部署

监视文件变动

hexo generate #使用 Hexo 生成静态文件快速而且简单
hexo generate --watch #监视文件变动

平时发布文章

hexo g
hexo d

配置参考

配置文件使用#注释,注意有空格。

根目录_config.yml配置:

# Hexo Configuration
## Docs: http://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
## 空一格 # Site
title: 飞鸿影~的blog
subtitle:
description: 开拓不止,路才无尽。
author: 飞鸿影
email:
language: zh-CN
timezone: # URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: 'http://52fhy.github.io/'
root: /
permalink: :year/:month/:day/:title/
# permalink: archives/:id/
permalink_defaults: # Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render: # Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: true
tab_replace: # Category & Tag
default_category: uncategorized
category_map:
tag_map: # 归档设置
## 2: Enable pagination
## 1: Disable pagination
## 0: Fully Disable
archive: 1
category: 2
tag: 2 # 服务器设置
## Hexo uses Connect as a server
## You can customize the logger format as defined in
## http://www.senchalabs.org/connect/logger.html
port: 4000
## server_ip: 0.0.0.0
logger: false
logger_format: # Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss # Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page # 插件和皮肤
## Plugins: https://github.com/tommy351/hexo/wiki/Plugins
## Themes: https://github.com/tommy351/hexo/wiki/Themes
theme: yilia ## landscape,yilia,pacman,coney
exclude_generator: # RSS
rss: /atom.xml #rss地址 默认即可 # Markdown语法
## https://github.com/chjj/marked
markdown:
gfm: true
pedantic: false
sanitize: false
tables: true
breaks: true
smartLists: true
smartypants: true # CSS的stylus格式
stylus:
compress: false # Deployment
## Docs: http://hexo.io/docs/deployment.html # 部署配置
deploy:
type: git
repo: git@github.com:xxx/xxx.github.io.git
branch: master # 评论
## disqus_shortname:
duoshuo_shortname: fhyblog

主题目录下也有个配置,大家根据作者说明进行配置。

参考

1、hexo + github + 多说 来搭建免费博客 // Netpi 日志

http://blog.netpi.me/实用/hexo/

2、使用hexo和Github上创建自己的博客_其它_其它语言-ITnose

http://www.itnose.net/detail/6231502.html

3、hexo常用命令笔记 - SegmentFault

http://segmentfault.com/a/1190000002632530

搭建hexo博客的更多相关文章

  1. 史上最详细“截图”搭建Hexo博客并部署到Github

    http://jingyan.baidu.com/article/d8072ac47aca0fec95cefd2d.html 大家也搭建过博客,很多时候,按着教程来做就可以了,但是我当时为了搭建Hex ...

  2. 史上最详细“截图”搭建Hexo博客——For Windows

    http://angelen.me/2015/01/23/2015-01-23-%E5%8F%B2%E4%B8%8A%E6%9C%80%E8%AF%A6%E7%BB%86%E2%80%9C%E6%88 ...

  3. 阿里云VPS搭建Hexo博客

    最近买了一个阿里云服务器,准备写自己的网站,和将自己的作品放在上面:开始的时候,感觉就一个服务器应该很简单,但是从申请域名到备案,再到服务器搭建,没想到一波三折:闲话不多说,只是记录我在搭建时,最简单 ...

  4. 树莓派搭建 Hexo 博客(二)

    Hexo 一个开源的博客框架,本文记录了一下在树莓派上搭建 Hexo 博客的过程. 上一篇介绍了 Hexo 的配置,现在网站已经能在本地访问了,也能通过 hexo generate 命令生成静态界面 ...

  5. 树莓派搭建 Hexo 博客(一)

    Hexo 一个开源的博客框架,本文记录了一下在树莓派上搭建 Hexo 博客的过程. 什么是 Hexo? Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解 ...

  6. 在vps上搭建hexo博客

    最近更换了服务器,需要把自己的Hexo Next重新部署到新服务器上,本文记录一下在vps上搭建hexo博客的过程. 在vps上搭建hexo博客需要下面这些工具: Nginx: 用于博客展示 SSH: ...

  7. 利用Serverless应用搭建Hexo博客

    本文将介绍如何使用火爆的Serverless应用,15分钟快速搭建Hexo博客.以腾讯云提供的Serverless应用–云开发为例: 步骤1:安装 CloudBase CLI 以及本地部署 Hexo ...

  8. 搭建hexo博客遇到的问题

    搭建hexo博客遇到的问题 常用命令 hexo clean 清除hexo缓存 hexo generate 生成文章 hexo deploy 部署 hexo new post name 新建文章名 he ...

  9. Termux搭建hexo博客并部署到GitHub

    Termux搭建hexo博客并部署到GitHub 安装 termux-change-repo apt update apt install git && nodejs &&am ...

随机推荐

  1. Android自定义View的实现方法,带你一步步深入了解View(四)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到第四篇了,回 ...

  2. Android视图绘制流程完全解析,带你一步步深入了解View(二)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/16330267 在上一篇文章中,我带着大家一起剖析了一下LayoutInflater ...

  3. LeetCode OJ-- 二战 Palindrome Number

    判断一个 int 是否为回文的 有一点要注意的是: int x; int _x = abs(x); 对 x 取绝对值的时候,会发生溢出.比如  x = INT_MIN 即 -2147483648 而 ...

  4. 【分块打表】bzoj3798 特殊的质数

    块大小为10^5. #include<cstdio> using namespace std; const int table[] = {0, 4784, 8978, 12981, 169 ...

  5. well属性

    Bootstrap 有一个 class 属性叫做 well,它的作用是为设定的列创造出一种视觉上的深度感(一种视觉上的效果,动手写代码体会一下).

  6. MVC中使用Ueditor

    配置.net mvc4项目使用ueditor编辑器. 1.首先下载Ueditor1.3.6开发版(http://ueditor.baidu.com/website/download.html) 2.将 ...

  7. install openvpn and openvpn manager in ubuntu

    sudo apt-get install openvpn sudo apt-get install network-manager-openvpn

  8. 如何让ECSHOP不同的分类调用不同模板方法

    如何给ecshop商品分类,显示不同的模板的话.可以通过不同的分类ID来取得不同模板.我们可以通过分类ID来判断,比如分类为1的,调用cat1.dwt.分类为2的,调用cat2.dwt,我们在cate ...

  9. caffe在windows 下的配置及matlab接口编译(无GPU)

    本人机子windows 10,matlab2015a,vs2013(官网使用的是vs2013) 1.首先去github上下载caffe的windows包,地址:https://github.com/B ...

  10. Dom4j 对XMl解析 新手学习,欢迎高手指正

    废话不多,先看代码 public static void main(String args[]){ ReaderXml("d:/example.xml");//读取XML,传入XM ...