hexo+gitHub 个人博客搭建及更换主题历程(特适合入门小白)
内容涵盖
- hexo+gitHub 个人博客搭建
- 搭建过程中遇到的问题及解决方案
- 更换主题
1. gitHub 创建博客仓库
(1) 注册Github(如果已注册可以忽略次此步骤)
详细注册步骤请参考: GitHub网站注册与登陆
(2) Github上新建自己的博客项目(即创建仓库)
注意:仓库名字要和(1)中注册的Github用户名一致!!!
XXX.github.io就是你的博客域名咯~
2. node和Git安装
(1) 安装 node.js
详细安装步骤请参考:nodejs详细安装步骤
(2) 安装 Git
详细注册步骤请参考:廖雪峰老师的git安装教程
3.Hexo安装
(1) 打开cmd命令编辑器(键盘同时按window+R–输入cmd–回车)
(2) 输入全局安装hexo-cli指令 (下载速度有点慢,耐心~~)
$ npm install -g hexo-cli |
(3) 初始化hexo(MyHexo文件夹名字自己取)
某盘下新建一个MyHexo文件夹 — 单机鼠标右键 — 选择 Git Bash here-- 出现命令窗口,输入下面命令:
$ hexo init blog |
当出现INFO Start blogging with Hexo!
表示Hexo初始化安装成功。并且MyHexo文件夹中出现 blog 文件夹。
(4) 初体验hexo魅力
由于初始化hexo 之后source目录下自带一篇hello world文章, 所以依次执行下方两个命令:
注意:执行下面命令前要先进入blog文件夹中重新打开git命令窗口!!!
$ hexo generate |
命令含义: 生成静态文件,等价于(可简写为): hexo g
$ hexo server |
命令含义: 启动本地服务器,等价于(可简写为): `hexo s`
打开浏览器,输入网址: http://localhost:4000/ ,即可看到网站初步的模样。
若出错提示404等,请参考博客4
4. 如何将github和hexo联系起来?
(1) 配置SSH key
为什么要配置这个呢?因为你提交代码肯定要拥有你的github权限才可以,但是直接使用用户名和密码太不安全了,所以我们使用ssh key来解决本地和服务器的连接问题。
a. 重新打开 Git 命令窗口,输入下面命令:
$ ssh-keygen -t rsa -C "git@github.com" //Github的注册邮箱地址 |
b. 一路Enter过来就好,得到的信息如下:
Your public key has been saved in /c/Users/user/.ssh/id_rsa.pub. |
找到该文件并打开,复制里面的所有内容,然后进入Sign in to GitHub:https://github.com/settings/ssh
c. 依次执行下面步骤:
点击 New SSH key —— Title:blog —— Key:输入刚才复制的 —— Add SSH key
d. 测试一下是否成功,输入下方命令:
$ ssh -T git@github.com //Github的注册邮箱地址 |
看到上面信息说明SSH已配置成功!
(2) 设置Git的user name和email
blog文件夹下的Git命令窗口依次执行下方两个命令:
$ git config --global user.name "liuxianan" // 你的github用户名,非昵称 |
$ git config --global user.email "git@github.com" // 填写你的github注册邮箱 |
设置这个是为了便与之后上传到github的page上。
(3) 修改参数及配置deployment
在blog目录下,打开_config.yml文件。
a. 修改网站相关参数信息
注意:在每个参数的:后都要加一个空格!!!
title: 焕小妹博客 //博客名字
subtitle: bug //博客副标题
description: Bug多多,欢乐多多 //博客描述
author: 焕焕 //作者
language: zh-CN //zh-CN 表中文
timezone: Asia/Shanghai //时间
b. 设置deployment参数信息
注意:仓库地址后加 .git 结尾!!!
deploy:
type: git
repository: git@github.com:saucxs/saucxs.github.io.git //Github注册邮箱:Github用户名/Github用户名.github.io.git
branch: master
c. 发布到网上,执行下面命令:
$ hexo deploy |
命令含义: 部署,等价于(可简写为): `hexo d`
若出错提示找不到git,请参考博客5
d. 测试是否发布成功
打开浏览器,输入网址: https://你的Github名.github.io ,即可看到部署好的网站,别人也可以访问。
5. 主题不喜欢,换!
hexo默认的主题是landscape,可以根据自己的喜好,换你喜欢的主题。
(1) 进入github官方主题界面,选择你喜欢的主题!
Hexo主题网站地址:https://hexo.io/themes/
(2) 复制主题地址
假如你喜欢的主题是:Anatole
a. 点击进入主题拥有者的博客:
b. 找到博主仓库入口进入(一般会有github图标)
c. 搜索栏中搜索刚才那个主题的名字
d. 点进去这篇博客,复制下载地址
(3) 下载主题
打开本地博客文件夹(这里对应上文的blog文件夹) —— 打开git命令窗口 —— 输入下面命令:
注意:仓库地址后加 .themes/Anatole 结尾!!!
$ git clone https://github.com/gaussic/hexo-theme-Anatole.git.themes/Anatole |
下载完之后会在themes 目录下生成一个名为Anatole文件
(4) 更改配置文件
更改一下blog工程(文件夹)目录下的配置文件_config.yml,主题名修改一下即可
(5) 更新并发布新主题
依次执行下方命令: (每一步作用及执行后界面,可参考上文)
$ hexo clean |
$ hexo g |
$ hexo s |
$ hexo d |
**(6) 测试新主题** 打开浏览器,输入网址: https://你的Github名.github.io ,即可看到更新后的主题网站。 ## 6. 创建新的博客及上传! **(1) 创建新的博客** 打开git命令窗口,输入下方命令:
$ hexo new '博客文章名字' |
在目录..\blog\source\_posts下即可看到新建的.md文件
(2) 遵循Markdown语法书写博客
友情链接:
a. Markdowen介绍及语法 b. MarkdownPad2安装教程
(3) 提交博客到GitHub仓库
打开本地博客文件夹(这里对应上文的blog文件夹) —— 打开git命令窗口 —— 输入以下命令:
a. 清空:
$ hexo clean |
b. 生成静态文件:
$ hexo g |
c. 将本地运行:
$ hexo s |
d. 发布到github的page上
$ hexo d |
e. 查看更新
打开浏览器,输入网址: https://你的Github名.github.io ,即可看到更新的博客。
参考博客
- 教你免费搭建个人博客,Hexo&Github
- github+hexo搭建自己的博客网站(二)更换主题yilia
- 如何更改使用hexo-github搭建博客的主题 theme
- hexo搭建Github博客上传后,访问网页显示404问题解决方案
- hexo d后 ERROR Deployer not found: git
hexo+gitHub 个人博客搭建及更换主题历程(特适合入门小白)相关推荐
- 【效率为王】超详细 Hexo + Github Pages 博客搭建教程
前言 现在市面上已经有许多博客了,比如 CSDN.掘金.博客园.简书等等.我们可以直接在上面发表内容,而且交互比较人性化,而且也能被搜索引擎检索到.但是总归是别人的平台,经常会受限,因此我们就希望能有 ...
- Hexo+GitHub静态博客系列1——三步快速搭建
前言 Hexo+GitHub静态博客搭建姿势千千万,各种教程也写烂 那么此搭建姿势就非主流些,侧重图形化操作,减少代码配置,适合新手快速搭建 说来本人也是臭毛病,wordpress.emlog等博客系 ...
- 用户名或用户域名_给自己的Hexo+GitHub静态博客绑定自己的专属域名
前言 GitHub+Hexo静态博客详细教程,介绍:对比:部署:发布 - 听海的博客www.tsingsea.com 以上是Hexo+GitHub静态博客超级详细搭建教程的正文部分,也算是这个专题教 ...
- hexo+github个人博客简易快速上手
在这个过程中无论任何报错和失误都不要怕,面向百度可以解决一切问题,百度不能解决的都是自己没查到位的,hexo+github搭建博客已经相对完善,解决方法也相对成熟,跟着前辈走总会有肉吃. 1.部署环境 ...
- github的博客搭建以及标签的自动化
github博客搭建以及标签的自动化 引子 没有github的程序员,不是好程序员! BUT 如果有一个*.github.io的blog,会不会更酷? 基于以上原因,本拐也折腾了一下自己的github ...
- Hexo+Github博客搭建之Matery主题个性化修改篇(一)
首先声明一下,一定要分清什么是站点配置文件,什么是主题文件,比如我在F盘新建我的博客文件夹,名称为blog,那么站点配置文件的路径为F:/blog/_config.yml,而你的主题配置文件路径为F: ...
- 【blog】小白博客搭建和踩坑历程 hexo+butterfly
我的博客 初始化 踩坑流程(hexo搭建+git+butterfly) 搭建流程 Hexo-零基础搭建个人博客(详解)_〆清峰ㄟ的博客-CSDN博客_hexo 换主题的bug Hexo启动页面显示ex ...
- Github相册博客搭建
前一段时间我看见一个问答,大概意思就是程序员都是怎么用自己的专业技能逗女朋友或表白的. 看了很多,有写定时关机脚本恶搞的,也有简单写个html展示的,其中最著名的就是几年前有个人写了个网页记录他们在一 ...
- GitHub个人博客搭建
实现思路来自(这个博客) 我的第一个博客(这里) 我的GitHub(GitHub主页) 需要学习的知识: GitHub基础: Windows cmd :(cmd基操) (cmd更换目录) Mark ...
最新文章
- 《Adobe Flash CS4中文版经典教程》——1.7 使用“工具”面板
- python 计算文件的MD5
- 大型网站架构演变和知识体系--转
- windows下ngnix+php配置
- 希尔排序(缩小增量排序)(插入排序的优化版) C++代码实现及算法分析 恋上数据结构笔记
- 连接API:如何将iOS和JSON框架集成
- PHP下用正则表达式分割preg_split、替换reg_replace、匹配preg_match_all等出现乱码的解决方法...
- 集群环境配置遇到的问题(随时更新)
- [mmdetection] - win10配置mmdetection(1.1和2.0) + 训练网络(faster-rcnn、mask-rcnn)
- Microsoft.Jet.OLEDB.4.0和Microsoft.ACE.OLEDB.12.0的适用版本
- 特斯拉在美国召回947辆电动汽车 因倒车影像显示延迟
- poj3204Ikki's Story I - Road Reconstruction(最大流求割边)
- 易语言 html替换,易语言教程文本替换和子文本替换
- 毕业设计选题管理系统
- 机器学习周刊第二期:深度学习上了Nature
- 和陌陌一样,今天 Instagram 也在网页版上又迈了一步
- windows命令——taskmgr 1
- Andorid 方法数超过64K的问题
- Docker学习(二)进阶
- 工厂模式——烘烤OO披萨