个人博客是程序员的名片之一,今天,我们来看怎么使用Hexo快速建立个人博客.

一.完工效果

http://www.lingyv.cn/ 这是本人建立好的个人网站.
有以下特点:
- 使用个人申请的特色域名
- 代码托管在github和coding上

二.需要使用的工具

Hexo (Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。) github链接 hexo帮助文档
主题icarus(更多主题)
github
coding(国内coding访问速度更快)

三.开始

1. github pages, coding pages

- github创建个人站点

- 设置站点主题

进入资源-setting
选择主题并发布,我的已经设置过一次了.所以会跟你的有所不同

- coding pages

coding创建项目

设置pages

2. 安装Hexo博客框架

安装git

$ sudo apt-get install git

安装Node.js

$ wget -qO- https://raw.github.com/creationix/nvm/master/install.sh | sh
$ nvm install 4

- 安装Hexo

$ npm install -g hexo-cli

- 新建blogs文件夹,克隆项目

git clone git@github.com:lingyv/lingyv.github.io.git

执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件

$ hexo init lingyv.github.io
$ cd lingyv.github.io
$ npm install

新建出的各种文件信息查看帮助文档

4. 配置Hexo

查看配置文档
我的配置文件信息

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/# Site 网站
title: 漫步太虚
subtitle: lingyv
description: coding
author: lingyv
language: zh-CN
timezone: avatar: /images/touxiang.png# URL 网址
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://www.lingyv.cn
root: /
permalink: :year/:month/:day/:title/
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: trueline_number: trueauto_detect: falsetab_replace:# Category & Tag 分类&标签
default_category: uncategorized
category_map:
tag_map:# Archives
archive: 1
category: 1
tag: 1# 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# Extensions 扩展
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: icarus# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:type: gitrepository:github: git@github.com:lingyv/lingyv.github.io.gitcoding: git@git.coding.net:lingyv/lingyv.gitbranch: master

5. 配置主题

Hexo主题很多,查看主题
- 下载icarus主题到本地

$ git clone https://github.com/ppoffice/hexo-theme-icarus themes/icarus

主题参考文档
- 启用主题
打开站点配置文件,找到 theme字段，并将其值更改为icarus.
- 配置主题配置文件

menu:首页: .归档: archives
#  Categories: categories
#  标签: tagcloud关于: /about
# Customize
customize:logo:enabled: truewidth: 40height: 40url: images/logo.pngprofile:enabled: true # Whether to show profile baravatar: css/images/touxiang.pnggravatar: # Gravatar email address, if you enable Gravatar, your avatar config will be overridenauthor: 凌宇author_title: Java & Pythonlocation: Shanghai, Chinafollow: https://github.com/lingyvhighlight: monokaisidebar: right # sidebar position, options: left, rightthumbnail: true # enable posts thumbnail, options: true, falsefavicon: # path to faviconsocial_links:github: https://github.com/lingyvweibo: http://weibo.com/5051531692/profile?topnav=1&wvr=6&is_all=1linkedin: http://cn.linkedin.com/in/lingyv
#        twitter: /
#        facebook: /
#        dribbble: /
#        rss: /
# Widgets 小工具
widgets:- recent_posts- category- archive- tag- tagcloud- links
# Search
search:insight: true # you need to install `hexo-generator-json-content` before using Insight Searchswiftype: # enter swiftype install key herebaidu: true # you need to disable other search engines to use Baidu search, options: true, false
# Comment
comment:
#    disqus: hexo-theme-icarus # enter disqus shortname here#使用多说评论duoshuo: lingyv
#    youyan: # enter youyan uid here
# Share
share: default # options: jiathis, bdshare, addtoany, default
# Plugins
plugins:fancybox: true # options: true, falsegoogle_analytics: # enter the tracking ID for your Google Analyticsgoogle_site_verification: # enter Google site verification codebaidu_analytics: # enter Baidu Analytics hash key
# Miscellaneous
miscellaneous:open_graph: # see http://ogp.mefb_app_id:fb_admins:twitter_id:google_plus:links:
#        Hexo: http://hexo.io

6. 购买域名

去万网或相关域名购买网站,挑选一个自己喜欢的域名吧

7. 域名解析

8. Hexo使用指南

操作指令参考文档

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

9. hexo d以后,刷新网站就可以看到部署好的效果了

使用Hexo建立个人博客相关推荐

用HEXO在Github建立个人博客
以前写过在Github创建个人专属名片, 有人提问在GitHub建立网站是怎么一回事? 在github建立的博客大多是一些静态的页面, 每次更新内容需要手动生成页面, 然后push到github, 我 ...
利用Hexo搭建个人博客－博客初始化篇
上一篇博文 <利用Hexo搭建个人博客-环境搭建篇> 中,我们讲解了利用Hexo搭建个人博客应该要配置哪些环境. 相信大家已经迫不及待的想要知道接下来应该要怎么把自己的博客搭起来了,下面, ...
换了电脑如何使用hexo继续写博客
前言我们知道,使用 Github+hexo 搭建一个个人博客确实需要花不少时间的,我们搭好博客后使用的挺好,但是如果我们有一天电脑突然坏了,或者换了系统,那么我们怎么使用 hexo 再发布文章到个人 ...
转：20分钟教你使用hexo搭建github博客
注册Github账号这里我们就不多讲了,小伙伴们可以点击这里,进入官网进行注册. 创建仓库图片来自Github 登录账号后,在Github页面的右上方选择New repository进行仓库的创建 ...
Hexo 搭建个人博客指南
引言人脑有限,对于同一个问题,也许当时花了许久时间解决了,然而过了一段时间,只留下一个印象,当再次需要解决时,还是需要较长时间来寻找以前的资料.因此,在这里建立个人博客,一是为了整理记录,让自己省心 ...
【Web前端】hexo+GitPages搭建博客
hexo建站 Hexo是基于node的,上传需要用到git,上传后存储到github上面. 一.配置环境 1.安装Node, 用来生成静态页面的 (1)下载地址:https://nodejs.org/ ...
通过GitHub Pages 搭建 Hexo 的个人博客
第一次在 CSDN 写文章写的不是很详细请见谅. 本篇文章将详细带你从头搭建属于自己喜欢的个人博客. 目录前言 Hexo 简介 Hexo 搭建教程安装Git 安装Node.js 安装 Hexo G ...
GitHub+Hexo 搭建个人博客（一）
什么是Hexo ? Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态网页托管在GitHub和Heroku上,是搭建博客的首选框架.这里我们选用的是GitHub,你 ...
hexo推送博客gitee 踩坑
本文重在排坑. hexo 推送博客 gitee 1. 安装node.js 什么是node.js 2. 安装npm 3. nodejs .npm环境变量配置 4. git工具的安装及配置 5. hexo ...

使用Hexo建立个人博客