前言
那啥我觉的这东西五分钟搞不定,所以五分钟学不会,首先声明啊,我也是头一次自己搭,大概花了 1+1.5+2=4.5(单位:小时)我大概花了,这么久,用实践证明,五分钟搭建都是在搞笑,好了,我之前说的,搭博客的目的是什么,哈哈,其实我觉得就俩字(zhuang bi),不过好在整完了,也挺值得的,你可以安按照我的思路安装,不保证一定成功,因为可能有乱码七招的错误,我这里把我的错误列出来,供你参考
搭建分为三种:
1.本地搭建
2.利用github搭建
3.个性域名搭建
那么分别来说一下这三种
一、本地博客的搭建
先看一下完成之后的样子吧,模样如果不喜欢可以换主题
大概就是这样,感觉很好,哈哈哈,反正我很满意
那么我们来说说具体步骤
1.Github账号
- 你需要一个github的账号来存储代码,如果有就跳过这步,如果没有就往下看创建一个
- 进入github官网,点击 sign up
然后按照要求填写需要的东西,总共需要三步,按照数字来就行
2.创建仓库
好了到了这步你应该就有一个github账号了,我们需要创建一个新的仓库来存储我们的代码和配置
- 先登录github
-
按顺序选择
这里有个需要注意的,**仓库的名字一点是,你的用户名加上 .github.io,这样的话会自动生成一个静态空间。
usernam.github.io #用户名替换成你的用户名
3.安装工具
接下来就需要正式的安装需要的工具的了
需要的东西一共有三个,分别是 Git,Nodejs,Hexo
安装比较简单,直接给出官方链接
安装Hexo,在CMD控制台或者Git里输入
npm install -g hexo-cli
出现这个说明安装成功
4.生成博客
东西都准备齐了,下面我们来生成博客
- 需要创建一个方博客的文件夹
- 在该文件夹下进入CMD控制台
- 初始化博客
hexo init
- 生成博客
hexo g #或许写成hexo generate
- 开启服务
hexo s #hexo server
然后打开浏览器,输入 localhost:4000 就可以浏览生成的博客了
- 注意
在生成时候可能有这么几个问题给你列出来一下
1.hexo s 启动服务后 打开localhost:4000 无响应的问题
2.打开网页显示白板和Cannot GET /
3.Hexo常见问题解决方案
4.还有个问题我遇到了,但是这里面没有,我给你说下
执行hexo s 时候出现
Usage: hexo<Command>
.......................
出现这个的原因是没有,本地服务也就是server没有安装,解决办法就是安装一下就好
npm install hexo-server --save
出现 hexo-server@0.1.2 node_modules/hexo-server
表示安装成功,在次执行
hexo s
INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.
这时候就可以访问了,如果还有错误,建议看看我上面的链接,里面几乎都有
那么如果一切正常的话,我们的本地的博客基本就完事了,接下来我们来把博客布置到Github上
二、布置博客到Github上
1.安装deployer
类似于github上的Git,提交用的
npm install hexo-deployer-git --save
2.配置_config.yml
打开_config.yml,找到deploy字段,这里面正常一共有四个东西
type: git
repo: git仓库项目地址
branch: 分支
message: 自定义提交说明,这个字段可以没有
大概就是这样子,按照我的样子改就行
3.配置免密登陆,并发布到GitHub上
- ssh-keygen #生成ssh文件
-
在本地找到 .ssh文件夹(一般是在管理员用户下)
-
打开id_rsa.pu,复制里面的内容,登陆你的github
title:填你自己能分别的就行
key:里填你刚才复制的内容
测试一下是否成功
ssh -T git@github.com
Hi username! You've successfully authenticated, but GitHub does not provide shell access.
显示这句话就说明,你的ssh没有问题,已经设置成功,如果让你输入yes/no 直接输入yes就好
- 设置账号信息
git config --global user.name "你的名字" #真实名字不是github用户名
git config --global user.email "邮箱@邮箱.com" #github邮箱
- 提交到github
hexo c
hexo g
hexo d
输入这俩命令,提交到github,这只是提交public文件夹
这里说一下hexo常用命令
hexo new "name" #新建文章
hexo new page "pageName" #新建页面
hexo generate #在public目录生成静态页面
hexo server #开启本地服务(默认端口4000,'ctrl + c'关闭)
hexo deploy #将目录部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本
命令的简写
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
说了这么多,这里面有一个很总要的文件叫_config.yml(全局配置文件)里面写入了所有的配置信息,我们来所一下里面的内容都代表什么意思
1.Site字段
title:网站标题
subtitle:网站副标题
description:网站描述
author:您的名字
language:网站使用的语言
timezone:网站时区。Hexo 默认使用电脑的时区
2.URL字段
url:网址
root:网站根目录
permalink:文章的永久链接格式
permalink_defaults:永久链接中各部分的默认值
3.Directory(关于文件夹内容的描述,默认值是文件夹的名字,这块一般不用改)
source_dir:资源文件夹
public_dir:公共文件夹,主要存放站点文件
tag_dir:标签文件夹
archive_dir:归档文件夹
category_dir:分类文件夹
code_dir:Include code 文件夹
i18n_dir:国际化(i18n)文件夹
4.Writing
new_post_name:新文章的文件名称
default_layout:预设布局
auto_spacing:在中文和英文之间加入空格
titlecase:把标题转换为 title case
external_link:在新标签中打开链接
filename_case:把文件名称转换为 (1) 小写或 (2) 大写
render_drafts:显示草稿
post_asset_folder:启动Asset 文件夹
relative_link:把链接改为与根目录的相对位址
future:显示未来的文章
highlight:代码块的设置
5.Category & Tag(分类 & 标签)
default_category:默认分类
category_map:分类别名
tag_map:标签别名
6.Date / Time format(日期 / 时间格式)
date_format:日期格式
time_format:时间格式
7.Pagination(分页)
per_page:每页显示的文章量 (0 = 关闭分页功能)
pagination_dir:分页目录
8.Extensions(扩展)
theme:当前主题名称。值为false时禁用主题,deploy:部署部分的设置
更换主题
个性域名的创建
如果你完成了,前两步,这步就简单了,你可以选择整,也可以就是使用 .github.io
分为三步:
- 购买域名
你需要购买一个域名,来更换你的原来的域名,这里推荐Godaddy,体验很棒!
几家域名注册服务商的比较
- 设置DMS解析
这不是一个一定要整的,因为Godaddy是国外的厂商,解析速度可能会有些慢,原因你懂!所以DNSPod的DNS解析服务,已经奔腾讯收购,微信就可以登录,很方便!
- 创建CNAME文件
这是为了让,github能接收你的域名,该文件放在source目录下(不要带txt后缀),例如我的里面就写了这么一句话 thirteenwang13.github.io 不要带其他的东西
最后在域名解析的选项卡里,添加这么两条东西一个主机记录写@,另一个写www,这样无论用户输入www.thirteenwang13.com还是只输入 thirteenwang13.com都可以直接定位到我的网站了,记录值放自己的GitHub Pages地址。
后记
呼,本来我在网上看了教程,以为挺简单的,后来自己实际做的时候,发现真不是这么回事,情况不一样就会出现各种奇怪的东西,难受,不过好在最后整完了,我设置设置里面的资源啥的就可以愉快的玩(zhuang)耍(bi)了,开心!
惯例hexo官方文档 和hexo官网