GitHub仓库创建
GitHub博客搭建的前提是有git,这个在上文已经提到了。
GitHub博客的仓库与代码托管的仓库有一点点不同,首先是仓库命名。他的仓库名字必须和GitHub的用户名字相同,如果你的GitHub名字是yourname,那么你的仓库名字就是yourname.github.io
然后在按照下图点击,目的是有一个可以被访问的链接。
先点Choose a theme,随便选一个主题,如果生成的网址是http://yourname.github.io,那么就成功了。
文件内博客构建
下载最新node.js
安装选项全部默认,一路点击Next。最后安装好之后,按Win+R打开命令提示符,输入node -v和npm -v,如果出现版本号,那么就安装成功了。
安装Hexo
创建一个文件夹,这个文件夹就是以后博客的存放地址。
在该目录下右键点击Git Bash Here,打开git的控制台窗口。定位到该目录下,输入npm i hexo-cli -g安装Hexo。会有几个报错,无视它就行。
安装完后输入hexo -v验证是否安装成功。然后就要初始化我们的网站,输入hexo init初始化文件夹,接着输入npm install安装必备的组件,这样本地的网站配置也弄好啦。
输入hexo g生成静态网页,然后输入hexo s打开本地服务器,然后浏览器打开http://localhost:4000 ,就可以看到我们的博客啦。按ctrl+c关闭本地服务器。
修改配置,链接GitHub
打开博客根目录下的_config.yml文件,这是博客的配置文件,在这里你可以修改与博客相关的各种信息。
修改最后一行的配置:
deploy:
type: git
repository: https://github.com/godweiyang/godweiyang.github.io
branch: master
repository修改为你自己的github项目地址。
写文章
首先在博客根目录下右键打开git bash,安装一个扩展npm i hexo-deployer-git。
然后输入hexo new post “article title”,新建一篇文章。
然后打开source\_posts的目录,可以发现下面多了一个文件夹和一个.md文件,一个用来存放你的图片等数据,另一个就是你的文章文件啦。
编写完markdown文件后,根目录下输入hexo g生成静态网页,然后输入hexo s可以本地预览效果,最后输入hexo d上传到github上。这时打开你的github.io主页就能看到发布的文章啦。
自定义博客主题
文章参考:Vince’s Blog
链接已失效
我选的主题是NEXT
安装一个插件
npm install hexo-theme-next
将这个主题放到theme文件夹中
在主文件_config.yml中修改信息
title: yourname's Blog
subtitle: ''
description: 'yourname的博客'
keywords:
author: yourname
language: zh-CN
timezone: ''
然后将 themes/next/_config.yml复制到你的博客根目录,重命名为_config.next.yml
在_config.next.yml中有关于next主题的链接,根据链接介绍配置next主题。
博客图片引用可以查看:hexo引用本地图片无法显示
博客文章置顶可以查看:hexo博客文章置顶功能实现的两种方法