效果可见 https://chungzh.cn
大家好,我是ChungZH。今天我们来自己搭建一个基于Hexo的博客网站。
前言
最近有小伙伴问我的博客是怎么搭建的,想自己做一个博客网站。为了让小伙伴们都能自己做一个网站,于是我便把我的建站过程写下来,供大家学习。
TRY
Hexo
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
配置环境
安装Hexo前,要先安装几个程序。(安装方法自行查找,本文不再赘述)
开始安装
打开终端,输入以下内容:
$ npm install -g hexo-cli
建站
安装完 Hexo 后,就可以正式开始建站了。
在终端中输入以下内容:
$ mkdir Hexo
$ hexo init Hexo
$ cd Hexo
$ npm install
其中,Hexo 是文件夹的名字,可以修改。
预览
在终端中输入:hexo server
直到出现INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
的时候,在浏览器中打开localhost:4000
即可看到网站。
(关于hexo server
命令,可以到Hexo官网学习,本文不再赘述)
注意:新建文章等可以前往Hexo官网学习。
配置
经过上一步之后,网站其实就已经搭建好了。不过为了让网站更好,我们还是配置一下 Hexo 吧。
安装NexT主题
在终端中输入以下内容:
$ git clone https://github.com/iissnan/hexo-theme-next themes/next
配置Hexo
用编辑器打开Hexo
目录下的_config.yml
,找到并修改以下内容:
# Site
title: Hexo # 此处改为你站点的标题
subtitle: # 此处改为你站点的副标题
description: # 此处改为你站点的说明
keywords: # 此处改为你站点的关键字
author: John Doe # 此处改为你的名字
language: # 此处改为 zh-CN
timezone: # 此处改为 Asia/Shanghai
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :year/:month/:day/:title/ # 此处可以改为 :title/
permalink_defaults:
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: landscape # 此处改为 next
修改完之后,再次在终端中输入:hexo clean && hexo server
,然后在浏览器中打开localhost:4000
,即可出现以下效果:
[图片上传失败...(image-f1796f-1534227827725)]
是不是很好看呢~
好了,我们继续配置。
配置Next
推荐前往iissnan的网站学习。如有不成功的,可在评论区留言。我会尽力解答。
上传至Coding Pages
首先,在Coding网站注册一个账号,同时在腾讯云注册一个账号。
然后打开Coding网站主页,点击左上角的购买
按钮,出现如下界面:
[图片上传失败...(image-8bc6b7-1534227827725)]
点击银牌会员
下面的马上升级
,就会跳转到绑定页面。在这个页面里绑定你的腾讯云账号即可。
注意:Windows用户请打开git终端,接下来的部分全部都需要使用git。要想打开git终端,在桌面点击右键,然后点击git bash here
即可。
配置ssh
打开终端输入 ssh-keygen -t rsa -C "your_email@example.com"
( 你的邮箱),连续点击 Enter 键即可。
ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
# Creates a new ssh key, using the provided email as a label
# Generating public/private rsa key pair.
Enter file in which to save the key (/Users/you/.ssh/id_rsa): [Press enter] // 推荐使用默认地址
Enter passphrase (empty for no passphrase): //此处点击 Enter 键即可,也可以填写密码,填写密码后每次使用 SSH 方式推送代码时都会要求输入密码,由于这个 Key 也不是用于军事目的,所以也无需设置密码。
成功之后显示如下信息:
Your identification has been saved in /Users/you/.ssh/id_rsa.
# Your public key has been saved in /Users/you/.ssh/id_rsa.pub.
# The key fingerprint is:
# 01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com
添加公钥
- 如果是Linux,在终端输入
open ~/.ssh
,用文本编辑器打开id_rsa.pub
文件,复制全部内容。如果是Windows,那么请打开C:\Users
,然后打开用你的账户名命名的文件夹。然后打开里面的.ssh
文件夹,再用记事本打开id_rsa.pub
文件,复制全部内容。 - 登录 Coding.net,进入『SSH 公钥』页面,点击『新增公钥』
- 将第一步中复制的内容填写到『公钥内容』一栏,公钥名称可随意填写
- 设定公钥有效期,可选择具体日期或设置永久有效
- 点击『添加』,然后输入账户密码即可成功添加公钥
- 完成后在命令行测试
ssh -T git@git.coding.net
,首次建立链接会要求信任主机
创建项目
- 新建一个名为
{user_name}.coding.me
的项目。{user_name}
指您本人的用户名(非昵称),使用其他人的用户名创建的项目不会被归为『用户 Pages』类型。 - 在项目里点击『代码 -> Pages 服务』,选择『静态 Pages』 选项卡,选择部署来源,点击『保存』。
创建完项目之后,打开你的项目的主页,找到如下界面:
[图片上传失败...(image-28d48-1534227827725)]
点击写有HTTPS
字样的下拉框,找到SSH
并点击。再复制右边的链接。
然后打开HEXO的_config.yml文件,找到deploy
:
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type:
并将它修改成如下
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo:
coding: 你刚刚复制的那个链接
然后在终端中输入hexo deploy -g
,你的网站就上传到Coding了。
去除广告
在next主题的_config.yml中找到
#custom_text: Hosted by <a target="_blank" href="https://pages.github.com">GitHub Pages</a>
改为
custom_text: Hosted by <a target="_blank" rel="external nofollow" href="https://pages.coding.me"><b>Coding Pages</b></a>
然后打开coding的官方文档,按照步骤进行配置即可。
绑定自己的域名
做完之后,网站就建立完毕了!
这是我的个人博客网站,欢迎大家前往参观:https://chungzh.cn
作者: ChungZH
特别鸣谢:成都-马龙
网友评论