hexo+github+freenom+dnspod免费搭建个人网站教程

前言

本篇是一个关于搭建个人网站的总结,通过在hexo管理github page,然后在freenom上注册免费域名,并通过dnspod进行域名解析。

关于hexo管理github.io可能不是很详细,因为是很早之前做的了,这里主要是总结一下,主要是讲进行域名绑定的步骤。

步骤

工具

  1. 安装Node.js

    https://nodejs.org/dist/v4.2.3/node-v4.2.3-x86.msi

    https://nodejs.org/dist/v4.2.3/node-v4.2.3-x64.msi

    安装后在命令行输入node -v和npm -v.如果成功输出版本号则说明安装成功。

  2. 安装Git

    https://github.com/git-for-windows/git/releases/download/v2.11.0.windows.3/Git-2.11.0.3-32-bit.exe

    https://github.com/git-for-windows/git/releases/download/v2.11.0.windows.3/Git-2.11.0.3-64-bit.exe

    安装后在命令行输入git –version,如果成功输出版本号则说明安装成功。

  3. 安装hexo
    因为hexo需要node.js和nmp,所以请确第一步成功。

    在命令行输入./npm install hexo-cli -g

    安装完成后再命令行输入hexo -v,如果成功输出版本号则说明安装成功

github page配置

  1. 注册登录github,添加一个仓库。
    例如dounia.github.io,然后在地址栏输入dounia.github.io即可访问,但是刚开始是404,因为你还没有给你的页面配置任何的内容。

    接下来就是利用hexo将hexo模板配置到github

hexo初始化配置

创建一个文件夹用来管理github page,例如dounia.github.io

然后进入该目录打开git bash

然后执行命令 npm install hexo -g

然后执行命令 hexo init,如果看到最后显示INFO Start blogging with Hexo!说明初始化成功了

加下来的两个命令用来试验是否Hexo模板初始化成功hexo g && hexo s,
然后在浏览器输入localhost:4000,如果进入了hexo的模板页,说明衣裳的步骤都成功了。

hexo diy

下边是使用hexo模板美化我们的github page

主题
  1. 下载主题。
    github上有很多开元的hexo主题,可以通过搜索hexo theme搜索。
    然后通过git命令克隆到我们的themes目录下, 例如git clone https://github.com/iissnan/hexo-theme-next themes/next

  2. 配置主题。
    主题下载下来之后要使用的话需要在hexo根目录也就是dounia.github.io/目录下 打开_config.yml,找到theme: landscape将landscape替换为next,next就是themes文件夹下你刚才下载的主题所在的文件夹。重新执行hexo -s,在浏览器输入localhost:4000测试是否成功。

内容

修改内容可以参考官方文档https://hexo.io/zh-cn/docs/configuration.html

例如:

title: 网站标题
subtitle: 副标题
description: 个人签名
author: 姓名
language: zh-Hans
timezone:

注意:这里你可能有注意到在这个_config.yml文件中有一个deploy标签,下边就会用到了,是用来管来github的。

配置远程仓库

修改dounia.github.io/_config.yml文件的deploy标签,关联到我们的仓库。

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:douyn/dounia.github.io.git
  branch: master

推送到远程仓库

  1. 安装部署工具。
    npm install hexo-deployer-git –save

  2. 初始化git仓库

    git init 
    git remote add origin git@github.com:douyn/dounia.github.io.git
    
  3. hexo clean && hexo g && hexo d

    1. 使用freenom注册域名。
    2. 在根目录下添加CNAME文件,里边内容为你的域名
    3. 在github项目setting的github page标签下Custom domain中,填写你的域名。
    4. dnspod域名解析中添加域名解析。而且要添加两条记录。
        |主机记录|记录类型|线路类型|记录值|权重|MMX优先值|TTL|
        |--|--|--|--|--|--|--|
        |www|CNAME|默认|dounia.github.io.|-|-|600|
        |@|A|默认|185.199.111.153|-|-|600|

        其中185.199.111.153为你的github page的ip,可以通过ping dounia.github.io得到

5. 在freenom网站services->My Domains,选择Manage Domain,选择Management Tools->Nameservers,填入F1G1NS1.DNSPOD.NET和F1G1NS2.DNSPOD.NET。

等待dns生效后即可访问

参考

https://blog.csdn.net/wapchief/article/details/54602515

https://freeknight.cf/2018/04/21/World/