搭建个人博客 github+hexo

其实相关的教程网上有很多很多,不过就是很多很多,而且技术大神们每个人都写得不一样啊喂,为什么我明明就是一步一步按照教程来的还是有那么多乱七八糟的错?...所以我决定写此篇记录一下我搭建博客的过程以及我踩过的一些坑...希望给和我一样的技术小白提供一些帮助。然后,感谢给我提供帮助的各位大神(后面会贴出 参考资料)

不做过多介绍了,快速开始

准备安装软件

依次安装

1、Node.js

2、Git

注册github

访问https://github.com/ 右上角signup

uername 最好都用小写,因为最后建立的博客地址是:http://username.github.io;邮箱十分重要,GitHub 上很多通知都是通过邮箱的。

创建Repository

Repository 名字应该是http://username.github.io。比如我的username 就是kkl1210

其他的可以选择添加一些描述也可以选择默认什么也不添加 ,点击creat repository

配置和使用Github

开始--所有应用--找到git bash

配置SSH keys

ssh keys就是用来使本地git 项目与github联系

1. 检查SSH keys的设置

首先要检查自己电脑上现有的 SSH key:

$ cd ~/. ssh

如果显示“No such file or directory”,说明这是你第一次使用 git

2、生成新的 SSH Key:

$ ssh-keygen -t rsa -C "邮件地址@youremail.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa):<回车就好>

【提示1】这里的邮箱地址,输入注册 Github 的邮箱地址;

【提示2】「-C」的是大写的「C」

然后系统会要你输入密码:

Enter passphrase (empty for no passphrase):<设置密码>
Enter same passphrase again:<再次输入密码>

在回车中会提示你输入一个密码,这个密码会在你提交项目时使用,如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。

注意:输入密码的时候没有输入痕迹的,不要以为什么也没有输入。

最后看到这样的界面,就成功设置ssh key了:

3、添加SSH Key到GitHub

在本地文件夹找到id_rsa.pub文件,看上面的图片第四行的位置告诉你存在哪里了

没找到的勾选一下文件扩展名 隐藏的项目

.ssh文件夹里记事本打开这个文件复制全部内容到

github相应位置。不要着急...(记得期末考试复习概率论看汤家凤老师的视频时老师的口头禅...)

你的github主页

点击头像后边的箭头(为什么我每次想要上传头像都没反应呢?希望有知道的小伙伴能看到告诉我一下)

Title最好写,随便写。网上有说不写title也有可能后期出现乱七八糟的错误

Key部分就是放刚才复制的内容啦 点击Add SSH key

测试

git bash 里

输入以下代码 不要改任何一个字 我就是自作聪明以为代表的是自己注册时候的邮箱然后...

$ ssh -T [email protected]

如果得到以下反馈

The authenticity of host ‘GitHub.com (207.97.227.239)‘ can‘t be established.
RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.
Are you sure you want to continue connecting (yes/no)

输入yes回车

Enter passphrase for key ‘/c/Users/lenovo/.ssh/id_rsa‘:

输入刚才设置的密码回车

设置用户信息

现在已经可以通过 SSH 链接到 GitHub 啦!当然还需要完善一些个人信息:

$ git config --global user.name "wuyalan"//输入注册时的username
$ git config --global user.email  "[email protected]"//填写注册邮箱

GitHub 也是用这些信息来做权限的处理,输入下面的代码进行个人信息的设置,把名称和邮箱替换成你自己的,名字必须是你的真名,而不是GitHub的昵称。

SSH Key配置成功

本机已成功连接到 github。

如有问题,请重新设置。常见错误请参考:

Connecting to GitHub with SSH?help.github.comError: Permission denied (publickey)?help.github.com

搭建hexo博客

利用npm命令安装hexo

$ cd
$ npm install -g hexo

1. 创建独立博客项目文件夹

安装完成后,关掉前面那个 Git Bash 窗口。在本地创建一个与 Repository 中博客项目同名的文件夹(如E:\http://username.github.io)在文件夹上点击鼠标右键,选择 Git bash here;

【提示】在进行博客搭建工作时,每次使用命令都要在 H:\http://username.github.io 目录下。

执行下面的指令,Hexo 就会自动在 H:\http://username.github.io 文件夹建立独立博客所需要的所有文件啦!

$ hexo init

2. 安装依赖包

$ npm install

3. 确保git部署

$ npm install hexo-deployer-git --save

4.本地查看

现在已经搭建好本地的 Hexo 博客了,执行完下面的命令就可以到浏览器输入 localhost:4000 查看到啦

$ hexo g
$ hexo s

hexo g 每次进行相应改动都要hexo g 生成一下

hexo s 启动服务预览

5. 用Hexo克隆主题

执行完 hexo init 命令后会给一个默认的主题:landscape

你可以到官网找你喜欢的主题进行下载 hexo themes 知乎:有哪些好看的 Hexo 主题?

找到它所在的 Github Repository (怎么找,我喜欢的那个,恰好博主放了他的github地址,emmm)

找到之后通过git命令下载

在主题的repository点击clone 复制一下那个地址

$ git clone +复制的地址+themes/archer

后面就是clone之后放到你本地的博客文件夹themes文件夹下 名字纹archer的文件 我下载的是archer主题~(有喜欢同样的小伙伴在个性化自己主题的时候欢迎来交流一下呀~真的是技术小白~还没研究清楚要怎么改,不过主题作者也会在readme说明的,细心看就是)

6. 修改整站配置文件

自己把 http://blog.io 中文件都点开看一遍,主要配置文件是 _config.yml ,可以用记事本打开,推荐使用 sublime 或者nodepad++打开。

修订清单如下,文档内有详细注释,可按注释逐个修订

  • 博客名字及作者信息:_config.yml
  • 个人介绍页面:about.md
  • 代表作页面:milestone.md

blog.io/_posts/2015-03-02-how-to-write.md?blog.io

这里贴一份网上看到的  可以复制替换原来的  但是替换之前最好备份 可能会出错
那要么你就对照着看一下改就好

# Hexo Configuration
## Docs: http://zespia.tw/hexo/docs/configure.html
## Source: https://github.com/tommy351/hexo/

# Site 这里的配置,哪项配置反映在哪里,可以参考我的博客
title: My Blog #博客名
subtitle: to be continued... #副标题
description: My blog #给搜索引擎看的,对网站的描述,可以自定义
author: Yourname #作者,在博客底部可以看到
email: [email protected] #你的联系邮箱
language: zh-CN #中文。如果不填则默认英文

# URL #这项暂不配置,绑定域名后,欲创建sitemap.xml需要配置该项
## 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/
tag_dir: tags
archive_dir: archives
category_dir: categories

# Writing 文章布局、写作格式的定义,不修改
new_post_name: :title.md # File name of new posts
default_layout: post
auto_spacing: false # Add spaces between asian characters and western characters
titlecase: false # Transform title into titlecase
max_open_file: 100
filename_case: 0
highlight:
  enable: true
  backtick_code_block: true
  line_number: true
  tab_replace:

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Archives 默认值为2,这里都修改为1,相应页面就只会列出标题,而非全文
## 2: Enable pagination
## 1: Disable pagination
## 0: Fully Disable
archive: 1
category: 1
tag: 1

# Server 不修改
## Hexo uses Connect as a server
## You can customize the logger format as defined in
## http://www.senchalabs.org/connect/logger.html
port: 4000
logger: false
logger_format:

# Date / Time format 日期格式,可以修改成自己喜欢的格式
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-M-D
time_format: H:mm:ss

# Pagination 每页显示文章数,可以自定义,贴主设置的是10
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Disqus Disqus插件,我们会替换成“多说”,不修改
disqus_shortname:

# Extensions 这里配置站点所用主题和插件,暂时默认
## Plugins: https://github.com/tommy351/hexo/wiki/Plugins
## Themes: https://github.com/tommy351/hexo/wiki/Themes
theme: landscape
exclude_generator:
plugins:
- hexo-generator-feed
- hexo-generator-sitemap

# Deployment 站点部署到github要配置
## Docs: http://zespia.tw/hexo/docs/deploy.html
deploy:
  type: git
  repository:
  branch: master

7. 启用新下载的主题

在刚打开的的_config.yml 文件中,找到“# Extensions”,把默认主题 landscape 修改为刚刚下载下来的主题名:

【提示】http://username.github.io 里有两个 config.yml 文件,一个在根目录,一个在 theme 下,现在修改的是在根目录下的。

8. 更新主题

git bash 里执行

$ cd themes/主题名
$ git pull

9. 本地查看调试

每次修改都要hexo g 生成一下

$ hexo g #生成
$ hexo s #启动本地服务,进行文章预览调试,退出服务用Ctrl+c

浏览器输入

localhost:4000 预览效果

将博客部署到http://username.github.io

1. 复制SSH码

进入 Github 个人主页中的 Repository,复制新建的独立博客项目:http://username.github.io 的 SSH 码

2. 编辑整站配置文件

打开 H:\username.github.io_config.yml,把刚刚复制的 SSH 码粘贴到“repository:”后面,别忘了冒号后要空一格。

deploy:
  type: git
  repository: [email protected]:username/username.github.io.git
  branch: master

3. 执行下列指令即可完成部署。

【提示】每次修改本地文件后,需要 hexo g 才能保存。每次使用命令时,都要在你的博客文件夹目录下

$ hexo g
$ hexo d

(ps:我在第一次hexo d 的时候出现了错误,具体错误提示忘了,原因是我没有deploy 的权限

在repository的setting

(这里我有一点小疑惑 为什么delete不了这个公钥呢,我想要delete是因为第一次设置时没有勾选 ..如下

emm里面的内容就是重复配置SSH key的步骤,记得勾选这个小框框,我就是没有勾选设置之后还是没有deploy成功

因为我看到的教程里大多数没有讲这一部分,所以我也不确定这一步是否必须,如果有遇到相同问题的小伙伴可以参考

【提示】如果在配置 SSH key 时设置了密码,执行 hexo d 命令上传文件时需要输入密码进行确认,会出现一个小框框。

输入密码之后在浏览器输入:

username.github.io

如果得到你想要的效果,那么恭喜你,博客已经搭建好啦!

允许你偷偷激动一下...哈哈哈

原文地址:https://www.cnblogs.com/xmilt/p/9525198.html

时间: 2024-08-02 06:41:01

搭建个人博客 github+hexo的相关文章

Hexo+Github/Coding免费搭建个人博客网站

体验更优排版请移步原文:http://vblog.win/blogs/other/hexo-github-build-blog.html 很早之前就想搭建一个属于自己的博客网站,一方面是给自己做笔记,把平时遇到的问题和解决问题的方式方法记录下来,顺便提升自己的表达能力.总结能力:另一方面,个人博客就像是自己在网络世界中的一个小家,一个完全属于自己的空间,你可以在这里尽情发挥,别人可以通过它来了解你.前段时间偶然间发现了Hexo,看了两天官方文档,参考网上教程,搭建了自己的个人网站:http://

《Hexo+github搭建个人博客》

<Hexo+github搭建个人博客> 文/冯皓林 完稿:2016.4.22-2016.4.23 注意:本节教程只针对Windows用户.本教程由无人赞助,赞助写出. <Hexo+github搭建个人博客>1 思维导图总览:2 What?2 简介:2 Hexo:2 NodeJs2 Github4 Git5 Github page:5 Markdown6 How?7 环境配置:7 安装Git8 安装Node.js9 安装hexo13 第一步:打开cmd.13 第二步:进入NodeJS

基于Hexo+Node.js+github+coding搭建个人博客——基础篇

附上个人教程:http://www.ookamiantd.top/2017/build-blog-hexo-base/ 搭建此博客的动机以及好处在此就不多谈了,之前已经表达过,详情请看Start My Blog Trip - Power By Hexo 记录一下搭建的基本过程以及遇到的一些问题,仅供参考 = =废话不多说,进入主题 Hexo博客搭建的基础大致流程为: 安装Node.js →安装Git → 安装Hexo → 安装主题 → 本地测试运行 → 注册给github与coding并创建pa

零基础免费搭建个人博客-hexo+github

使用hexo生成静态博客并架设在免费的github page平台 准备 系统: Window 7 64位 使用软件: Git v1.9.5[下载地址] 百度云 360云盘 访问密码 d269 Git官网 Node.js v0.12.5 x64[下载地址] 百度云 360云盘 访问密码 608f node.js官网32位或64位按自己电脑的系统来选择,如果不清楚,可以直接在官网下载32位的,可以兼容64位系统 备注:不同软件版本的安装与使用会有差异,请尽量与本教程保持一致 安装Git 大部分按默认

github搭建个人博客 hexo框架 next主题

之前就想搭建自己的博客,现在终于得以实施. 参考了多篇博客,然后又在虚拟机了往往复复试了好多次, 现在基本搭建完毕. 我是基于hexo博客框架, next主题搭建的博客, 静态网页.   大体就是, 先在本地搭建好整个系统, 然后再提交到github. 因为此篇文章只是捡部分内容说,所以我先列出来我参考的博客,这里谢谢他们的无私分享了. hexo博客框架 + next主题 + 插件等整个流程请参考ezlippi的两篇博客:  https://www.ezlippi.com/blog/2015/0

使用Node.js+Hexo+Github搭建个人博客(续)

一.写在前面 在我的上一篇博客<使用Nodejs+Hexo+Github搭建个人博客>中,已经介绍了如何使用 Hexo 在 Github Pages 上搭建一个简单的个人博客.该篇博文将在上篇博文的基础上分别从以下几个方面做简单的后续介绍: 博客相关配置介绍 博客主题 Yilia 配置介绍 如何制作并配置网站缩略图 如何将博客同步到 Github.Coding 中 如何使用 Git 同步 Github 与 Coding 的代码 如何申请域名并作域名解析 如何将域名绑定至 Github.Codi

使用Hexo和Github Pages快速搭建个人博客

在编程路上,每天都在网上查看别人的博客,大牛的文章写得通俗易懂,同时博客网站也非常华丽.作为出入编程的一枚小白也想拥有这样一个自己的网站.那就立马去买一个域名了,在网上找教程来搭建. 搭建的过程还算比较顺利,没有遇到多大的问题,虽然这篇博客的内容也是从别人的博客东粘西补过来的,为什么要东粘西补呢,因为光照着一篇博客并不能顺利搭建,还需要其他博客来补充. 本博客的最大好处是只要阅读这一篇博客就能解决问题,这里找出了我踩过的雷坑,方便大家畅通无阻的搭建. 原材料 域名(自行购买) node.js(官

使用hexo+GitHub搭建个人博客的心得(含教程)

Author Email Yaoyao Liu [email protected] 前言 对于广大CS专业的学生和码农,找一个地方写博客,记录一些编程.配置环境.阅读论文的心得体会是一个很常见的习惯.当然想搭建个人博客,就需要找个靠谱的平台,主要就是以下的两种方式: 使用网站提供的博客平台,例如国内的CSDN.博客园:国外的Blogger.Wordpress 自己建站,发布到自己的服务器上,或者发布到GitHub.GitLab.Bitbucket等支持静态网页发布的git平台 针对于第一种方式,

使用 Hexo,Material Theme 以及 Github Pages 搭建个人博客

title: 使用 Hexo,Material Theme 以及 Github Pages 搭建个人博客 date: 2019-04-29 00:05:50 tags: 其他 --- 准备条件 Node.js npm Git GitHub账号 开始搭建 hexo init Blog cd Blog npm install hexo-deployer-git --save npm install hexo-material cp node_modules/hexo-material themes/