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

体验更优排版请移步原文:http://vblog.win/blogs/other/hexo-github-build-blog.html

很早之前就想搭建一个属于自己的博客网站,一方面是给自己做笔记,把平时遇到的问题和解决问题的方式方法记录下来,顺便提升自己的表达能力、总结能力;另一方面,个人博客就像是自己在网络世界中的一个小家,一个完全属于自己的空间,你可以在这里尽情发挥,别人可以通过它来了解你。前段时间偶然间发现了Hexo,看了两天官方文档,参考网上教程,搭建了自己的个人网站:http://vblog.win/ 欢迎访问!搭建完毕在此记录一下搭建过程。

1. 环境准备

1.1 node.js安装和准备

在node.js官网 http://nodejs.cn/download/ 下载对应安装文件,保持默认设置,一路next,安装结束。
打开命令提示符,输入node -vnpm -v输出当前版本号说明node环境搭建完成。

1.2 git安装和准备

在Git官网 https://git-scm.com/downloads (如未FQ下载过慢可参考地址)下载对应安装文件,保持默认设置一路next也没毛病,这里一点提醒,Git出于安全考虑,只能在Git Bash中进行Git有关的命令操作,如果想要在命令提示符中使用Git命令,在安装过程中调整PATH环境一步需勾选第二项,这样Git安装程序会在系统PATH中设置Git路径,以便于我们在命令提示符中直接使用Git命令(尽管可以这样设置,但还是建议都在Git
Bash中输入命令)。

打开命令提示符,输入git --version输出当前版本号说明Git环境搭建完成。

2. Github账户配置

2.1 创建仓库

相信很多coder都有自己的GitHub账号(没有的话去注册一下),利用GitHub建立自己的博客首先需要创建一个username.github.io的仓库,这里的username必须是你的用户名(不是昵称),之后你的个人博客地址就是 http://username.github.io 了。

2.2 代码库设置

接下来,在新建立好的仓库主页点击菜单栏Settings,找到下方GitHub Pages开启该功能,选择一个主题并提交更改,几分钟后打开 http://username.github.io 你就可以访问自己的博客主页了。

2.3 配置SSH key

因为我们的博客内容托管于GitHub,因此提交代码需要提供权限给本地,这里使用SSH key相对来说要安全一些,输入命令:


1

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

之后会提示输入一个密码,这个密码在提交代码时使用,这里也可以直接回车,密码置空。最终会在用户目录下生成.ssh文件夹,进入文件夹找到id_rsa.pub文件并打开,复制内容并打开 https://github.com/settings/keys 新建SSH key,title自己命名,把刚刚复制的内容粘贴到key处保存,设置完毕。

测试配置是否成功:


1

ssh -T [email protected]

Hi wangqingkai! You’ve successfully authenticated, but GitHub does not provide shell access.

看到如上信息则说明SSH key配置成功。

2.4 配置Git个人信息


1

2


git config --global user.name "username" // github用户名,不是昵称

git config --global user.email "[email protected]" // github注册邮箱

3. Hexo安装与配置

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。还是推荐花时间看下官方文档:https://hexo.io/zh-cn/docs/

3.1 Hexo安装

新建一个用于存放个人博客源文件的文件夹,进入文件夹开始安装Hexo,由于npm下载一些包在国内会非常慢,这里推荐使用淘宝镜像,右击Git Bash输入以下命令等待安装:


1

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完成之后基本所有命令中的npm都可以用cnpm替代。输入命令:


1

cnpm install -g hexo

Hexo安装完成之后紧接着开始初始化,输入命令:


1

2


hexo init // hexo初始化

hexo g // 生成网站源文件

生成之后的目录结构应该是这样的,


1

hexo s // 启动本地测试服务

服务启好之后浏览器打开 http://localhost:4000 ,如果可以正常访问,说明我们本地博客已经搭建起来了。Ctrl+C关闭测试服务。

3.2 Hexo配置

3.2.1 Hexo主题配置

因为默认主题达不到我们的要求,首先对Hexo主题进行配置,这里是Hexo官方主题。我们用比较受大众喜爱的yilia主题为例,在博客根目录输入命令:


1

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

之后修改博客根目录下_config.yml文件中主题配置为:theme: yilia


1

2


hexo clean // clean删除public文件夹

hexo s -g // 生成网站源文件并启动测试服务(合并命令)

刷新 http://localhost:4000 是不是发现高端大气上档次了一些!至于头像、title、菜单等的配置,仔细读一下官方文档,研究一下配置文件(主要有两个_config.yml,一个在博客根目录下,另一个在themes下对应的主题文件夹下),相信这些都难不倒你。

3.2.2 Deployment配置

这个很关键,因为博客搭建好了,你不可能让它一直在本地运行,需要把它托管到GitHub或者Coding上,别人才可以访问,因此需要配置Deployment。全局配置文件_config.yml中找到Deployment,配置如下代码:


1

2

3

4

5


deploy:

type: git

repo:

github: [email protected]:username/username.github.io.git,master

coding: [email protected]:username/username.git,master

我这里同时托管到GitHub和Coding,单独托管到GitHub也可以,把另外一条配置去掉就好。不过这样配置提交的时候一般会报错ERROR Deployer not found: git,不要慌,安装一个插件:


1

cnpm install hexo-deployer-git --save

3.2.3 Hexo部署到Git


1

2


hexo clean

hexo d -g // 生成网站源文件并部署到Git(合并命令)

现在到浏览器里访问一下 http://vueker.github.io 惊不惊喜,意不意外!这里是我的测试博客,欢迎访问 http://vblog.win/ 查看效果,与我交流。

4. 如何写博客

4.1 使用命令创建博客

cd到博客根目录,输入命令:


1

hexo new ‘hello-first-blog‘

这样,Hexo会帮我们在\source\_posts下新建md文件,打开该文件即可使用Markdown语法开始写博客。

4.2 手动新建md文件

当然,我们也可以在\source\_posts目录下新建md文件直接进行编辑,需要注意的是md文件的命名一般采用英文,文件内title名为中文即可。推荐作业部落在线编辑器

5. 后记

Hexo + Github搭建静态博客的确很方便,上手也不难,而且静态博客访问速度快,易于维护,很重要的一点它是完全免费的。目前还可以采用很多第三方系统进行扩展服务,只要你想,几乎都可以做到。在此记录下自己搭建博客的点滴,希望可以和广大coder一起交流,共同进步,欢迎访问主页

时间: 2024-12-15 07:12:03

Hexo+Github/Coding免费搭建个人博客网站的相关文章

零基础免费搭建个人博客-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 大部分按默认

使用hexo和github搭建个人博客网站

使用hexo+github可以免费.快速地搭建一个静态博客网站,并且使用hexo提供的命令以及git自身的功能可以很便捷地管理博客. 使用github部署静态页面 在了解hexo之前,我们先看看如何使用github部署静态页面. 注册github账号 访问github官网注册一个账号,该流程和一般网站注册账号一样,在此不赘述. 创建一个git仓库 其他项如果需要可以自主填写,这里只填写仓库名,点击Create repository创建仓库. 提交一个测试页面 执行git clone命令将仓库克隆

阿里云+wordpress搭建个人博客网站

文章来源:http://www.cnblogs.com/smyhvae/p/4965163.html 原文服务器准备部分去掉了,记录重要部分留作回头整理. 版本情况如下: 阿里服务器web环境一键安装包 官网购买地址: 分享:https://files.cnblogs.com/files/wowind/sh-1.5.5.zip wordpress: 官方下载地址:https://cn.wordpress.org/ phpMyAdmin: 官方下载地址:https://www.phpmyadmin

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

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

从0开始搭建个人博客网站(一)

写在前面 本人编程小白一枚,在读学生,一直想搭建一个自己的博客网站,上星期抽出了一点时间,参照羊哥的视频手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo和各路大神的教程,搭建了自己的博客网站https://trace001.gitee.io 在这里分阶段记录一下搭建的整个过程 介绍一下 搭建环境 搭建环境是window10,博客框架使用的是Hexo Hexo官方介绍 Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内

从0开始搭建个人博客网站(二)

写在前面 上一篇博客写了如何将博客网站部署在本地,这篇文章主要是写如何将博客网站部署到远端,也就是Github或者Gitee.作者目前正在做毕业设计,仅仅完成部署和样式修改工作,之后会抽时间写博客以及优化访问速度.博客网站:https://trace001.gitee.io/ 部署个人博客到Github上 安装Git插件 在自己新建的blog文件夹下鼠标单击右键点击git bash here,终端输入:cnpm install --save hexo-deployer-git 注册并登录Gith

基于docker搭建wordpress博客网站平台

WordPress是使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站.也可以把 WordPress当作一个内容管理系统(CMS)来使用. WordPress是一款个人博客系统,并逐步演化成一款内容管理系统软件,它是使用PHP语言和MySQL数据库开发的.用户可以在支持 PHP 和 MySQL数据库的服务器上使用自己的博客. WordPress有许多第三方开发的免费模板,安装方式简单易用.不过要做一个自己的模板,则需要你有一定的专业知识.比如你至少要

在腾讯云上面搭建WordPress博客网站

一.准备工作 我们使用腾讯云服务器来运行WordPress,腾讯云会给新用户七天的产品体验时间还有一些代金券,做为新手尝试成本是比较小的. 腾讯云长期举办 “云+校园” 活动,学生只要1元即可购买专享云服务器,活动详情请见这里.学生优惠在每天的中午12点抢购. 二.购买服务器 当认证完了之后开始购买服务器 注意我在这个地方选择的是 杭州康展通信科技(我在这个配置下初次需要登录服务器获取相关信息,由于自己不熟悉centos系统,咨询了客服技术人员才解决). 但是我看见有人推荐使用这个版本,说在第一

基于Hexo搭建个人博客网站

## 准备工作 首先下载[nodejs](https://nodejs.org/en/download/),一路next安装即可.验证是否安装成功: ```bash node -v # 输出 v10.15.1 npm -v # 输出 6.8.0 ``` 接下来更改npm的安装源,这能大大加快安装包的速度. ```bash npm get registry # 输出默认源 https://registry.npmjs.org/ npm config set registry http://regi