经常看到大牛的博客非常的高大帅气,虽然我很渣,但是逼格不能输,所以有了以下的搭建记录。

我的成果ninwoo,喜欢的可以参考下面的记录一起来动手搞起来。

安装Git Bash

访问git下载最新版本的git bash

安装完成之后,右键打开git bash,设置用户名和邮件信息

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

生成ssh秘钥文件

ssh-keygen -t rsa -C "GitHub注册邮箱"

直接三个回车即可,默认不需要设置密码。

查看生成的公钥

cat ~/.ssh/id_rsa.pub

复制内容,打开github setting keys界面,创建新的SSH key,并粘贴公钥到Key输入框中。

在git bash中测试是否配置成功

ssh git@github.com

出现:

PTY allocation request failed on channel 0
Hi Ninwoo! You've successfully authenticated, but GitHub does not provide shell access.
Connection to github.com closed.

证明设置成功。

创建GitHub仓库

创建新的仓库,仓库名为[用户名].github.io,用户名用Github名称代替。

这样做的主要目的就是为了以后可以通过该网址进行访问你的博客主页,所以要仔细设置。在这里,我配置成Ninwoo.github.io

以下的配置中,也需要对应修改为你自己的仓库名。

安装Node.js

访问Node.js官网下载安装包。

下载完成后,点击安装。打开CMD查看是否安装成功。

C:\Users\ljo04>node -v
v8.12.0 C:\Users\ljo04>npm -v
6.4.1

如果上述命令均正常通过,则安装完成。

安装Hexo

1.创建一个新的文件夹作为Hexo的开发目录,这里我命名为Hexo_project

E:\project>mkdir Hexo_project

2.使用npm安装Hexo

为了提高安装速度,先配置淘宝npm镜像

E:\project\Hexo_project>npm config set registry https://registry.npm.taobao.org

3.安装Hexo

E:\project\Hexo_project>npm install -g hexo-cli

4.初始化hexo

E:\project\Hexo_project>hexo init blog
INFO Cloning hexo-starter to E:\project\Hexo_project\blog
Cloning into 'E:\project\Hexo_project\blog'...
remote: Counting objects: 68, done.
remote: Total 68 (delta 0), reused 0 (delta 0), pack-reused 67
Unpacking objects: 100% (68/68), done.
Submodule 'themes/landscape' (https://github.com/hexojs/hexo-theme-landscape.git) registered for path 'themes/landscape'
Cloning into 'E:/project/Hexo_project/blog/themes/landscape'...
remote: Counting objects: 838, done.
remote: Compressing objects: 100% (6/6), done.
Receiving objects: 26% (222/838), 292.01 KiB | 88.00 KiB/s

这个过程可能需要等待一阵时间

5.测试站点是否创建成功

# 创建一篇博客test
E:\project\Hexo_project\blog>hexo n test # 生成博客
E:\project\Hexo_project\blog>hexo g # 启动服务器预览
E:\project\Hexo_project\blog>hexo s

这时,可以打开浏览器访问http://localhost:4000/,查看blog界面,发现已经创建好新的文章test。

推送至网站

1.修改blog配置文件E:\project\Hexo_project\blog\_config.yml

deploy:
type: git
repo: git@github.com:Ninwoo/ninwoo.github.io.git
branch: master

注意:这里repo要选择ssh的git库链接,否则会在部署的时候报错

2.安装Git部署插件

E:\project\Hexo_project\blog>npm install hexo-deployer-git --save

3.部署博客

E:\project\Hexo_project\blog>hexo clean
E:\project\Hexo_project\blog>hexo g
E:\project\Hexo_project\blog>hexo d

4.测试是否部署成功

现在访问https://ninwoo.github.io/ ,如果出现blog界面这证明部署成功。

更换主题

如果觉得默认主题实在是太丑,可以更换其他主题,下面的教程中,我选择Next主题。

1.下载主题

E:\project\Hexo_project\blog> git clone https://github.com/theme-next/hexo-theme-next themes/next

2.打开配置文件E:\project\Hexo_project\blog\_config.yml更换主题

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next
plugins: hexo-generate-feed

3.重新部署blog

E:\project\Hexo_project\blog>hexo clean
E:\project\Hexo_project\blog>hexo g
E:\project\Hexo_project\blog>hexo d

小节

到这里,高端大气上档次的Blog就创建完成了,读者可以开始编写自己的blog啦!

搭建好看的静态博客(使用Hexo进行搭建)的更多相关文章

  1. Docsify+腾讯云对象存储 COS,一键搭建云上静态博客

    最近一直在想如何利用 COS 简化静态博客的搭建过程.搜了很多的静态博客搭建过程,发现大部分的静态博客都要通过编译才能生成静态页面.功夫不负有心人,终于让我找到了一个超简洁博客的搭建方法. 效果预览 ...

  2. Hexo搭建 github.io 静态博客使用指南

    What? Hexo 是一个快速.简洁且高效的博客框架.可以使用markdown 解析成文章,在几秒内,即可利用靓丽的主题生成静态网页. Why? 笔记需要整理 How? github 创建 char ...

  3. 使用vuepress搭建GitHub pages静态博客页面

    vuepress官网 vuepress是尤大开发来写文档的静态页面.可以用Markdown 语法,并且也可以使用vue模块化的方式开发页面. vuepress-theme-reco 是另外的开发者开发 ...

  4. Github、Jekyll 搭建及优化静态博客方法指南

    尝试自己写 Blog 的人,一般会经历三个阶段. 第一阶段,刚接触 Blog,觉得很新鲜,试着选择一个免费空间来写. 第二阶段,发现免费空间限制太多,就自己购买域名和空间,搭建独立博客. 第三阶段,觉 ...

  5. 用hexo在github上搭建自己的静态博客

    在自己的小站上发过一次,这边就不再多发一次了,直接给链接好了: http://nerohwang.github.io/2014/02/11/simple-test/

  6. 转--利用hexo搭建个人静态博客

    引用地址 可谓图文并茂,可以配合 七牛云存储(做图片等文件服务器),搭建好看的个人博客 hexo 官方指导文档 主题 官网教程 问题集锦 简书 http://blog.csdn.net/wx_9624 ...

  7. 基于mkdocs-material搭建个人静态博客

    基于mkdocs-material搭建个人纯静态博客,没有php,没有mysql 如果你只是想安安静静的放一些技术文章,发布到个人站点或github-pages,mkdocs-material很适合你 ...

  8. Hexo搭建Github静态博客

    1. 环境环境 1.1 安装Git 请参考[1] 1.2 安装node.js 下载:http://nodejs.org/download/ 可以下载 node-v0.10.33-x64.msi 安装时 ...

  9. hexo搭建静态博客

    1. 环境环境 1.1 安装Git 请参考[1] 1.2 安装node.js 下载:http://nodejs.org/download/ 可以下载 node-v0.10.33-x64.msi 安装时 ...

随机推荐

  1. Java多线程和并发基础面试总结

    多线程和并发问题是Java技术面试中面试官比较喜欢问的问题之一.在这里,从面试的角度列出了大部分重要的问题,但是你仍然应该牢固的掌握Java多线程基础知识来对应日后碰到的问题.收藏起来,希望给予即将找 ...

  2. Odoo图片如何显示

    转载请注明原文地址:https://www.cnblogs.com/cnodoo/p/9281423.html odoo没有专门的图片标签,但是可以通过widget来控制field标签来显示图片内容. ...

  3. (第二章)改善JavaScript,编写高质量代码。

    建议34:字符串是非值操作 var a = "javascript"; var b = a; b = b.toUpperCase(); alert(a); //javascript ...

  4. 正则表达式利用grep和sed处理日志内容,获取所需的内容

    app.log文件内容: 2014-09-11 00:00:01,516 INFO [com.tt.bb.thread.Control] - Socket连接:/182.105.83.33:53217 ...

  5. oracle ORA-01722:无效数字 记录

    今天在对12万条记录的表进行左联接时,有时可以查询出数据,有时会报无效数字,反复检查,发现问题. 例如sql: SELECT * FROM USER U LEFT JOIN USER_ROLE UR ...

  6. cpu 基础知识

    认识cpu(中央处理器简称处理器)也叫CPU,Central Processing Unit线程是安排CPU执行的最小单位 四核八线程内涵: 每个单位时间内,一个CPU只能处理一个线程(操作系统:th ...

  7. 学记笔记 $\times$ 巩固 · 期望泛做$Junior$

    最近泛做了期望的相关题目,大概\(Luogu\)上提供的比较简单的题都做了吧\(233\) 好吧其实是好几天之前做的了,不过因为太颓废一直没有整理-- \(Task1\) 期望的定义 在概率论和统计学 ...

  8. 进程调度之FCFS算法(先来先运行算法)

    #include<stdio.h> #define PNUMBER 5//进程个数 #define SNUMBER 3//资源种类个数 //资源的种类,三种 char stype[SNUM ...

  9. typename在C++中的用法

    . //在C++中typename一般用来声明模板的模板参数(template parameter): template<typename T> class X; //T是一个模板参数 . ...

  10. 用HTML编写阿里云

    <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...