1.Github Pages

Github Pages可以免费托管,所以把博客托管到github上。

首先,创建一个github仓库,仓库的命名格式为:yourusername.github.io,然后根据提示进行下一步。

2.Hexo搭建博客

本博客中使用了Anisina的主题,所以会详细介绍下按照Anisina主题搭建的步骤。

1.准备工作

1.首先要安装下node.js(官网下载),如果已经安装可以跳过。
2.安装git(官网下载)
3.安装Hexo:

$ npm install -g hexo复制代码

安装成功后,使用version命令查看是否安装成功

& hexo version复制代码

4.本地静态hexo博客

  • 新建一个文件夹,作为你博客文件的根目录
  • 命令行进入该文件夹下,输入以下命令,生成模板:
$ hexo init复制代码
  • 模板生成后,输入以下命令:
$ npm install复制代码
  • 最后可以运行hexo s命令查看是否搭建成功

2.下载主题

git clone https://github.com/Haojen/hexo-theme-Anisina.git themes/Anisina复制代码

3.配置博客

1.配置博客封面图

将img的alt属性设置为post-cover即可

2.用户信息配置

注意:必须在主题的_config.yml中配置一下信息,而非博客根目录下的_config.yml中配置。

user_name: your name
user_avatar: your avatar
user_location: your location
user_description: about you introduction// this info will show About page
user_contact:
user_introduction:// config you share info
weibo_username:
zhihu_username:
github_username:
twitter_username:
facebook_username:
linkedin_username:复制代码

3.创建About页面

在根目录下的source文件夹里创建一个about文件夹,然后在about文件夹里新建index.md文件,在文件中添加如下代码,并保存:

title: about
date: 2017-09-11 23:12:50
layout: about复制代码

需要提一下的是,作者还没有支持对About页面内容的修改,所以本博客搭建的时候,直接在themes/Anisina/layout/about.ejs中修改的内容。

4.创建Works页面

在根目录下的source文件夹中创建works文件夹,如上新建一个index.md,添加如下内容到文件中,并保存:

title: My Works
date: 2017-09-11 23:16:50
layout: works复制代码

然后在source文件夹下创建一个_data文件夹,打开文件夹,新建project.json文件,文件格式如下:

{"Apple 官网临摹": {"title": "Apple 官网临摹","subTitle": "根据美版apple官网临摹","img_link": "http://o7bkkhiex.bkt.clouddn.com/item-apple.jpg","use" : ["jQuery"],"link": "http://haojen.github.io/apple-linmo/","data":"2016.3","direction": "临摹 2016 年三月份 Apple 美版单页面。"},"Anisina (阿尼丝娜)": {"title": "Anisina","subTitle": "基于 Hexo 制作的个人博客主题","img_link": "http://o7bkkhiex.bkt.clouddn.com/Anisina.png","use" : ["jQuery","Bootstrap","Node.js","EJS","Hexo","SASS"],"link": "http://haojen.github.io/","data": "2016.5","direction":"Hexo 是某位台湾友人基于 Node.js 编写的博客框架"}
}复制代码

5.添加评论系统

主题中支持来比力的配置,所以在_config.yml配置文件中添加两行配置代码即可。

use_livere: true
livere_uid: 你的来比力的注册uid复制代码

6.添加百度统计

主题中添加了百度统计的js代码,在配置文件中直接添加track_id即可:

ba_track_id: your track id复制代码

7.部署Hexo博客

  • 建站
hexo init yourname
cd yourname
npm install复制代码
  • 配置_config.yml的部署:
deploy:type: gitrepo: http://github.com/yousername/yourusername.github.iobranch: master #默认master复制代码
  • 清除缓存
$ hexo clean复制代码
  • 生成静态网页
$ hexo g复制代码
  • 本地查看效果,执行完后可以通过http://localhost:4000查看本地效果
$ hexo s复制代码
  • 部署到git
$ hexo d复制代码

3.绑定阿里云域名

之前在阿里云买了域名,域名购买成功之后要等待实名认证。

1.添加CNAME文件

在根目录下的source文件夹下新建CNAME文件,没有后缀。

在Sublime Text中打开CNAME文件,在里边添加你的域名信息,如图:

保存之后,重新部署到github pages上。

2.给github项目添加

在项目的Settings中,添加Custom domain到自己的域名:

3.给域名添加解析记录

1.ping你自己的yourname.github.io获取到ip地址:

2.打开域名的解析列表,添加两条解析记录:

更换之后,可能需要等一段时间才能生效,差不多就大功告成啦。

Github Pages+Hexo+阿里云域名绑定相关推荐

  1. 【配置】GitHub Pages使用阿里云域名

    一.购买域名 在阿里云上购买(申请)相关域名 二.配置阿里云域名解析 1️⃣登录阿里云:https://cn.aliyun.com/?from_alibabacloud= 在导航栏 [产品]中搜索[云 ...

  2. python实现阿里云域名绑定动态IP

    一般家庭网络的公网IP都是不固定的,而我又想通过域名来访问自己服务器上的应用,也就是说:需要通过将域名绑定到动态IP上来实现这个需求.于是乎,我开始探索实现的技术方案.通过在网上查阅一系列的资料后,发 ...

  3. 阿里云域名绑定解析完整教程

    阿里云域名注册地址:阿里云万网域名注册 1.进入域名控制台,按下图步骤进入域名控制台 2.勾选待解析域名,点击右侧的解析按钮 3.看到如下图内容,如果是新手可以点击1新手指导按钮进行设置,大神请点击2 ...

  4. 购买阿里云域名绑定ip教程

    域名注册-工商财税-知识产权-资质备案-智能设计-网站建设-万网-阿里云旗下品牌 点击搜索选择域名可以选择购买域名 选择完成以后,提交订单,完成域名购买 购买完成以后进入控制台,在左上角有个图标.鼠标 ...

  5. 【Hexo】GitHub_Page绑定阿里云域名

    前言 对于使用GitHub_Pages的小伙伴来说,GitHub自带的xxx.github.io网址,很容易被挡掉,就像这样▼ 我猜大概率是因为这种网址没有证书.没备案之类的,导致浏览器检测不安全,用 ...

  6. github pages + Hexo + 域名绑定搭建个人博客增强版

    概述 前面我们用github pages + Hexo 搭建了一个简单版的个人博客系统,但是里面的内容单调,很多功能不够完善,所以我们需要对yelle 的主题进行优化和完善.基本搭建请访问:http: ...

  7. 阿里云域名 动态ip绑定 python方案

    阿里云域名 动态ip绑定 python方案 一.配置config.json 二.代码 三.打包执行 思路:阿里云提供dns域名解析api,查出外网ip,定时更新域名解析. 一.配置config.jso ...

  8. GitHub Pages + Hexo搭建个人博客网站,史上最全教程

    文章目录 一.准备工作 1. GitHub账号 2. 安装Git 3. 安装NodeJS 二.创建仓库 三.安装Hexo 四.更换主题 1. NexT 主题 2. Fluid主题 五.创建文章 六.个 ...

  9. 用Github Pages+Hexo搭建博客之(八)Hexo博客Next主题添加统计文章阅读量(访问量/浏览量/阅读次数)功能

    [置顶][专栏]用Github Pages+Hexo搭建博客 文章目录 [置顶][专栏][用Github Pages+Hexo搭建博客](https://blog.csdn.net/qq_342439 ...

最新文章

  1. 【机器学习】激活函数(Activation Function)
  2. jboss部署出现jboss.naming.context.java.rmi找不到错误
  3. 编java用jdk还是editplus_怎样运用EditPlus进行配置Java编译环境
  4. 64位linux下was宕机,was7经常自动宕机,前方告急,工程师面临崩溃.小弟跪上
  5. java非递归方式实现快速排序
  6. 迈向成功的关键在于执行(摘自李开复博士的《做最好的自己》)
  7. HTML5与JavaScript
  8. 李开复给中国学生的第六封信:选择的智慧
  9. 【问链财经-区块链基础知识系列】 第三十三课 区块链溯源方案设计-中检集团区块链溯源平台
  10. 前端工程师面试题JavaScript部分(第二季)
  11. boost::math::differentiation用法的测试程序
  12. C0301 代码块{}的使用,重定向, 从文件中读取行
  13. IBASE Header change - access sequence
  14. mysql timestamp类型比较_MySQL timestamp 类型比较的测试
  15. psql 时间日期操作符和函数
  16. TensorFlow官方发布剪枝优化工具:参数减少80%,精度几乎不变
  17. ThingsBoard 提示 New ThingsBoard version xx is availabled!
  18. PWA--未来式app
  19. 禁用Dropbear中DNS反向查询连接客户端地址补丁
  20. idea 谷歌翻译

热门文章

  1. HTML特殊转义字符列表
  2. 教你打造优秀IT博文
  3. 用tabbar mode为Emacs建立ta
  4. 深入剖析防火墙策略的执行过程
  5. IIS6.0限制上传文件大小的解决办法
  6. return2libc学习笔记
  7. spring的xml配置文件出现故障
  8. STL容器迭代过程中删除元素技巧
  9. 图解Ubuntu 9.10 Alpha 6
  10. 活动目录管理之五种常见错误操作