美文网首页
Hexo结合Github搭建博客

Hexo结合Github搭建博客

作者: APTX4869 | 来源:发表于2019-11-28 16:57 被阅读0次

    可以通过github建立一个名为xxxx.github.io的免费博客网站,不需要过多资源~

    1、首先,Github账户要建立一个名为“账户名.github.io”的项目(仓库)(这个名字不要用其他的,据说用别的会很麻烦)

    其实,建完之后,我们浏览器访问 账户名.github.io就可以看到一个博客页面  

    2、安装node.js(https://nodejs.org/en/download/

    3、命令行执行npm install -g hexo-cli安装hexo(https://hexo.io

    4、创建一个用于存放目录管理的文件夹,名字随意

    5、命令行切换到该目录,执行hexo init,然后会拉下来一批管理文件,注意其中的_config.yml文件,这个文件负责博客的各种配置

    可以设置title、subtitle、description、keywords、author等(参照https://hexo.io/zh-cn/docs/configuration.html

    6、编辑_config.yml将博客与github关联,配置下列内容:

    这里要注意:网上有的说type后边是github,这个是不对的。

    另外,注意type和repository字段行要和标题deploy行有一定的缩进差(2个字符?,不然会报错)。。。

    type和repository后边的“:”后还要有个英文半角空格,再接上内容,不然也会报错。(这都什么玩意。。。)

    7、安装git部署插件 npm install hexo-deployer-git --save

    8、执行命令(详见https://hexo.io/zh-cn/docs/commands):

    hexo clean //清理静态文件

    hexo g //生成静态文件(全部写法为generate,可简写,每次发布新文章都需要)

    hexo s//本地预览(全部写法为server),可以通过http://localhost:4000 访问,但注意4000端口可能被占用,可以通过命令hexo s -p 5000(或其他数字) 配置其他端口

    hexo d //部署(全部写法为deploy),即上传到相关git项目

    9、上述建立的是一个默认博客样式,如需更换主题,可访问https://hexo.io/themes/查看,选择合适的,然后用git拉取,比如执行以下命令:

    git clone https://github.com/iissnan/hexo-theme-next themes/next(就是拉取next主题,放在博客目录下的themes/next文件夹下)

    git clone https://github.com/Sariay/hexo-theme-Annie.git themes/Annie

    git clone https://github.com/iTimeTraveler/hexo-theme-hiker themes/hiker等

    然后,打开_config.yml文件,配置theme字段为新的主题名

    10、如何写文章?

    在目录下执行创建文章的命令:hexo new  '文章名',然后会在source/_posts目录下产生新的markdown文件

    11、点开文件可以编辑,上下两个“---”之间的是信息区域,包括文章标题,日期等,下边可以随意粘贴文字,

    其他markdown规则可以参考教程https://www.runoob.com/markdown/md-tutorial.html,文章创建好之后,执行hexo g、hexo d就发布了~

    12、还可以把github网站绑定到个人域名上。首先去域名网站购买一个域名~

    13、在本地博客source 文件夹下面创建 CNAME 文件(没有后缀扩展名的),在里面写上购买的域名(没有前缀,比如www之类的)

    14、比如阿里巴巴购买的,首先,命令行,ping 一下自己的github博客地址,获取ip地址,然后点击下边的解析设置,填入ip地址,

    15、打开 xxxxx.github.io 项目的(Settings)设置,然后在 GitHub Pages的 Custom domain设置里填上购买的域名(不需前缀),ok~

    16、如果github博客的设置页面出现如下提示:

    需要在域名解析下添加如下CNAME设置:

    关于添加A记录和CNAME记录的区别:A记录和CNAME记录的区别

    17、由于github是国外网站,所以博客访问会比较慢,那如何优化一下速度呢?可以选用一下国内代码管理平台与hexo结合,比如coding

    18、coding的操作基本与github一致,官方操作文档:https://dev.tencent.com/help/doc/quick-start/creating-pages

    19、将hexo部署到coding项目库的方法:配置_config.yml文件,hexo g,hexo d。。。(注意格式,冒号后要有空格,以及对齐什么的)

    20、部署成功后,我们可以在coding看到项目文件:

    21、与github相似的page页面服务配置:https://dev.tencent.com/help/doc/quick-start/creating-pages#i

    22、在域名管理后台配置解析设置:原github博客地址修改为境外解析路线,再添加两个指向coding地址的解析

    22、访问可能会出现异常:

    可以参照https://dev.tencent.com/help/doc/faq/coding-pages/ssh/tls

    23、可以看到本地用于管理项目的目录内容跟实际远端部署的用于展示的项目内容是有区别的,为了方便管理,本地博客管理文件也应跨端保存管理起来,可以在远端新建一个分支专门用于管理本地博客配置。

    相关文章

      网友评论

          本文标题:Hexo结合Github搭建博客

          本文链接:https://www.haomeiwen.com/subject/ubpbwctx.html