现在位置: 首页 > 免费软件 > 正文

Hexo免费静态博客安装和使用方法-基于Node.js高效率静态博客程序

2014年05月20日 评论数 71 ⁄ 被围观 20,843 个+

Hexo免费静态博客安装和使用方法-基于Node.js高效率静态博客程序

在写Github空间在线写文章时,就发现有朋友正在折腾Hexo免费静态博客程序,Hexo基于Node.js,出自台湾一博主,Hexo生成的静态网站可以放在任意空间上,例如常见的PHP、ASP空间、FTP服务器、百度BAE、新浪SAE等空间,可以说只要可以用Web访问的就可以搭建起Hexo博客。

据作者所称,Hexo与之前的Octopress静态博客程序相比,生成静态博客的效率更高,不过在部落看来,Hexo静态博客生成环境搭建比起Octopress要简单一些,只要安装了Git和Node.js,我们就可以在Windows电脑上快速地用Hexo来写作,Hexo同样支持评论、分类、标签、图片等。

本篇文章就来介绍一下Hexo静态博客环境的搭建和Hexo博客的发布方法,想要了解更多的有关于静态博客程序和空间有:

Hexo免费静态博客安装和使用方法-基于Node.js高效率静态博客程序

一、Hexo静态博客相关的准备工作

1、必选一:下载并安装好msysGit工具:msysGit下载地址

2、必选二:下载并安装好Node.js软件:Node.js安装包下载。(32位)

3、可选一:相关的FTP软件、Winscp上传工具等等。

4、可选二:下载并安装好TortoiseGit工具:TortoiseGit下载地址(32位的)。TortoiseGit已经有了中文语言:TortoiseGit中文包下载地址

5、注意:可选的软件安装取决于你要将Hexo发布在哪些空间上,有些空间可以直接用FTP上传即可,有些如Github可以用Git上传,而BAE、SAE等云空间可以用TortoiseGit上传。

二、Hexo静态博客安装与使用教程

1、安装好了msysGit和Node.js软件后,打开Git Bash,执行以下命令开始安装:npm install -g

Hexo开始安装

2、经过部落测试发现直接用npm安装话经常出现卡住而导致无法正常安装,解决办法就是修改npm的安装源,以下三种方法任选一个即可(正常的朋友不用执行这一步)。

  • 1.通过config命令:
  • npm config set registry https://registry.cnpmjs.org
    npm info underscore (如果上面配置正确这个命令会有字符串response)
    2.命令行指定
  • npm –registry https://registry.cnpmjs.org info underscore
    3.编辑 ~/.npmrc 加入下面内容
  • registry = https://registry.cnpmjs.org

Hexo安装成功

3、安装成功后,执行以下代码指定Hexo到文件目录中:hexo init <folder>,或者用CD的方法进入到指定的目录,再执行:hexo init

Hexo指定文件夹

4、接着执行以下命令生成静态页面至public目录:hexo generate

Hexo生成静态博客

5、这时候在目录下就可以看到相应的文件了。

Hexo博客目录

6、如果你想本地预览一下Hexo博客,可以执行:hexo server,接着打开https://localhost:4000就可以看到效果了。

三、Hexo静态博客写文章、安装主题、添加评论功能

1、用Hexo来发表新文章,执行:hexo new “my new post”,其中my new post为文章标题。

Hexo新文章

2、执行命令后,会在项目\source\_posts中生成my new post.md文件,用编辑器打开,开始写博客就行了。

Hexo编辑文章

3、怎么写博客?你要用到Markdown语法,还没有接触过Markdown语言的朋友,可以看一下快速入门:https://wowubuntu.com/markdown/

4、Hexo静态博客想要安装主题也容易,在Github上找到你喜欢的主题,然后执行类似命令:git clone https://github.com/heroicyang/hexo-theme-modernist.git themes/modernist

5、这时就将modernist主题下载下来了,打开hexo\_config.yml,修改主题为modernist:theme: modernist

6、如果你要对整站进行设置,相关的选项说明如下:


# Hexo Configuration

# Site
title: 免费资源部落标题
subtitle: 次标题
description: 描述
author: 作者
email: 邮箱
language: zh-CN

# URL
url: https://www.freehao123.com #域名
root: /
permalink: :year/:month/:day/:title/ #URL结构
tag_dir: tags #标签
archive_dir: archives #汇总
category_dir: categories #分类
code_dir: downloads/code

# Writing
new_post_name: :title.md # 新的文章名
default_layout: post #New的默认
auto_spacing: false # Add spaces between asian     characters and western characters
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
max_open_file: 100
multi_thread: true
filename_case: 0
render_drafts: false
highlight: #代码高亮
enable: true
  line_number: true
 tab_replace:

# Category & Tag #分类与标签
default_category: uncategorized 
category_map:
tag_map:

# Archives 
## 2: Enable pagination #激活分页
## 1: Disable pagination #禁止分页
## 0: Fully Disable #全部禁止
archive: 1
category: 1
tag: 1

# Server
port: 4000 #预览端口
logger: false
logger_format:

# Date / Time format #时间格式
date_format: MMM D YYYY
time_format: H:mm:ss

# Pagination #分页数
per_page: 10
pagination_dir: page

# Disqus #Disqus评论
disqus_shortname: freehao123 

# Extensions
theme: modernist  #主题
exclude_generator:

# Deployment #上传
deploy:
  type: github #方式
  repository: [email protected]:freehao123/ifreehao123.github.io.git
   branch: master

7、Hexo中的modernist主题已经支持直接添加第三方评论代码,打开themes\modernist\layout\_partial\comment.ejs,将你的第三方评论代码添加进去即可。


<% if (config.disqus_shortname && page.comments){ %>
<section id="comment">
  #评论代码
<% } %>

四、Hexo静态博客发布到Github免费空间上

1、如果你之前有玩过:用Octopress免费静态博客系统在Github免费空间上搭建个人网站,那么肯定想把Hexo静态博客发布到Github空间上。

2、首先我们需要到Github空间上新建一个项目名,名称要以freehao123.github.io这样的形式,然后我们需要添加S-S-H Key到Github项目上了。

Hexo添加到Github上

3、关于密钥生成,我们可以直接使用Puttygen。

Hexo使用Puttygen生成

4、将用Puttygen生成的密钥复制到Github空间上。

Hexo复制密钥

5、接着在Puttygen中导出密钥。

Hexo导出密钥

6、然后再用Git连接上Github空间上,接着你就可以执行推送到服务器了:hexo generate和hexo deploy

五、Hexo静态博客发布到免费云空间上

1、免费云空间,国内常见的就是百度SAE新浪SAE阿里云ACE,国外的的免费云空间就非常地多了,比如Herokusourceforge空间GAE等等,这些云空间都可以长期使用的,搭建个人博客是没有问题的。

2、这些免费云空间一般会支持TortoiseGit来上传,不想用Git工具的朋友,可以选择更为简单的TortoiseGit,首先是在TortoiseGit中检查Git安装,Git没有安装的,TortoiseGit不能正确运行。

TortoiseGit检查安装

3、然后在本地新建一个文件夹,作为TortoiseGit同步的目录。

TortoiseGit同步文件

4、接着克隆云空间上的项目文件。

TortoiseGit克隆空间文件

5、最后你就可以将Hexo生成的静态博客文件用TortoiseGit上传到云空间上了。

TortoiseGit上传空间文件

六、Hexo免费静态博客使用小结

1、Hexo免费静态博客难点有两个,一是npm的安装,另一个是静态的设置与书写。至于如果来上传Hexo生成的静态博客,假如你实在不想用什么Git这类复杂的工具,完全可以用FTP软件将Public中文件上传到Web服务器上。

2、Hexo静态博客不一定要发布在Github空间,可以说只要支持Web访问的空间都可以存放Hexo静态博客,有些人嫌PHP空间跑PHP太耗费资源,干脆就将Hexo免费静态博客放在PHP等动态空间上,这样的静态页面应付大流量是没有问题的。

文章出自:免费资源部落 https://www.freehao123.com/ 版权所有。本站文章除注明出处外,皆为作者原创文章,可自由引用,但请注明来源。

共有 71 条留言 访客:71 条 博主:0 条

  1. 四弦  2016.08.11 回复

    老大,我也投一篇Hexo搭建的稿子(一整天+一个晚上心血之作 :mrgreen:
    https://hexo.n4l.pw/how-to-set-up-hexo-blog-on-linux.html
    望采纳,感谢!

    qi 回复:

    @四弦, 好强大,我马上转载!

    四弦 回复:

    @qi, 非常感谢。现在的地址是https://n4l.pw/how-to-set-up-hexo-blog-on-linux.html
    把WordPress数据迁移到Hexo去了

    qi 回复:

    @四弦, 好的,正在更新。

  2. yearliny  2016.04.08 回复

    为什么你的网站不考虑移动端优化呢?这样看着有点费劲。另外百度转码是什么鬼,那个简直是影响使用体验。

    qi 回复:

    @yearliny, 从百度来的会被自动转码。加入收藏夹吧,直接打开。手机端主题还有测试中,很快就会放出来了。

  3. Chonghua  2015.04.07 回复

    有没有可视化编辑的静态博客呢

  4. 北门放羊  2014.09.19 回复

    是不是少了一个步骤,在写文章之前,要先安装依赖关系
    $ npm install
    不然没法将md文件生成html。
    我是新手啊,我发现按博主的教程出了点问题,到网上找教程发现少了一个步骤。

  5. OpooPress  2014.05.30 回复

    Hexo是个不错的东东,作者比较会做UI设计,这点比我强 :mrgreen:

    另外一点,国内用 Windows 机器的人相对多些,能够一个包安装是比较方便的做法,相对不懂技术的人来说也比较简单。

    qi 回复:

    @OpooPress, 博主也很厉害,能够推出自己的博客系统来。

  6. 郭爱兵  2014.05.23 回复

    @qi,发现Picpick这软件忒神奇、截同样大小的图:有时10k,有时80k,这是闹哪样啊

    qi 回复:

    @郭爱兵, 这个和图片有关系,看图片的像素以及颜色。

  7. Nin  2014.05.21 回复

    其实,如果自己有VPS的话,再配合Dropbox,就可以利用脚本来实现自动检测,自动生成,自动部署了。

    qi 回复:

    @Nin, 意思是在VPS写博客?

    Nin 回复:

    @qi, 在VPS端自动检测Dropbox同步目录,然后自动生成,部署,本地要做的就是写文章然后扔进Dropbox的同步目录就行了。
    具体的参考大概就是这个样子的.
    [url]https://lucifr.com/2013/06/02/hexo-on-cloud-with-dropbox-and-vps/[/url]

    Nin 回复:

    @qi, 这样的话,不管在哪,只要有Dropbox能用,就能写文章,虽然。。繁琐了点。

    qi 回复:

    @Nin, 这样确实强大,我去看看。

    Lar 回复:

    @qi, 也可以直接部署到VPS上。

  8. 狙殇  2014.05.21 回复

    推荐一个Markdown语言在线编辑器
    写博客的时候很方便
    https://mahua.jser.me/

    qi 回复:

    @狙殇, 不错,我去试试。

  9. 郭爱兵  2014.05.21 回复

    @qi 部落的截图的大小好小呢、有软件或秘诀不,我要 🙄

    qi 回复:

    @郭爱兵, 用的是Picpick,截图设置好固定大小。

    郭爱兵 回复:

    @qi, 嗯嗯呢、谢谢、试个去

  10. xnces  2014.05.21 回复

    qi,可以写一个cnode论坛程序的安装教程吗?表示我不会。。。

    qi 回复:

    @xnces, cnode是一个程序吗?

    xnces 回复:

    @qi, 是啊!是一个做的很不错的开源论坛程序,项目地址是:https://github.com/cnodejs/nodeclub/

    qi 回复:

    @xnces, 程序不错,我去尝试一下。

    xnces 回复:

    @qi, 希望尽快出教程,谢谢qi了!

    qi 回复:

    @xnces, 好的,感觉有些难度。

  11. 猫箱内の巴托拉  2014.05.21 回复

    回去试试看

  12. kukugt  2014.05.21 回复

    感觉有点略复杂唉,@qi可否给个论坛邀请码

    qi 回复:

    @kukugt, 你好,用这个:knbn0s

  13. 不认识  2014.05.21 回复

    Node.js。。。这玩意还是算了吧

  14. xhhjin  2014.05.21 回复

    不能用么。。。“用静态页面生成静态博客”链接地址是:https://isnowfy.github.io/about-simple-cn.html

    qi 回复:

    @xhhjin, 前几天已经分享过了:https://www.freehao123.com/github-farbox-dropbox/

    xhhjin 回复:

    @qi, 落后了 ❓ ❓

  15. xhhjin  2014.05.21 回复

    话说昨晚也在折腾Hexo,还不错,不过看到一个更简单的在github上的simple项目,便捷性直接秒杀Hexo啊:用静态页面生成静态博客

  16. 潮流台  2014.05.21 回复

    :mrgreen: 没有演示地址吗!

    xhhjin 回复:

    @潮流台, 我来贴一个,发布到Bitbucket上的:[url]https://xhhjin.bitbucket.org/[/url]

    qi 回复:

    @潮流台, 作者的官网就是用Hexo搭建的:zespia.tw

  17. johnhuo  2014.05.21 回复

    这两天静态博客甚是很火啊,连续写了好几篇了。。。

    qi 回复:

    @johnhuo, 是呀,过几天再写点WP静态化加速的文章。

    hot8bbs 回复:

    @qi, 这个静态博客能挂载到dropbox网盘吗.?dropbox和金山都支持挂静态网站.一旦静态化,主机开销就小了,wordpress太浪费资源.

    qi 回复:

    @hot8bbs, 可以,理论上讲只要是支持Web访问的网盘都应该可以。

  18. pirlo  2014.05.20 回复

    感觉安装好复杂,还是wordpress来的简单

    qi 回复:

    @pirlo, 博主的英文博客流量如何?

    pirlo 回复:

    @qi, 上线3个月,alexa现在涨到71w多,pr=0。每天独立ip5个左右吧,打算在[email protected]上发帖子,引导一些流量过来

    qi 回复:

    @pirlo, 坚持就会有收获。

    pirlo 回复:

    @qi, 我第一次这么认真的做seo,我这样应该算正常的吧?

    qi 回复:

    @pirlo, 没有问题。

    hot8bbs 回复:

    @pirlo, 有没有搞错才五个独立ip就70多玩,我和你排名差不多,可我是上千ip英文流量,主机都有些吃不消.你那五个独立ip全是站长吧,都带着alexa工具条来的吧.alexa排名10万以后数据都不大准,基本不靠谱.Qi这个站排名还比较可信

    pirlo 回复:

    @hot8bbs, 确实如此哦,不过现在排名下来了。之前的流量都是google带来的。
    另外请教如何才能增长流量呀?

  19. Jason  2014.05.20 回复

    静态博客什么样的?有演示网址吗?

  20. 圣华博客,设计分享博客  2014.05.20 回复

    过来看下,辛苦

  21. 我来冒个泡

  22. ytf4425  2014.05.20 回复

    我比较喜欢Octopress

  23. musk100  2014.05.20 回复

    还是喜欢WordPress

  24. 悦听有声  2014.05.20 回复

    天天都有新内容!

  25. 无纯洁  2014.05.20 回复

    后排…

  26. 带着幾米去旅行  2014.05.20 回复

    发现评论框变身了 😉

    qi 回复:

    @带着幾米去旅行, 变成什么样子了?

    带着幾米去旅行 回复:

    @qi, 😀 嗯,这样 🙄 ,这样 👿 ,嗯,就这个样,嘻嘻~

    qi 回复:

    @带着幾米去旅行, 之前一直有。

    弥左拉 回复:

    @带着幾米去旅行, 你怎么在这里?

  27. Kung  2014.05.20 回复

    中排。。。

  28. 超超  2014.05.20 回复

    前排

  29. 逗妇乳  2014.05.20 回复

    前排。

  30. 若水  2014.05.20 回复

    前排。

  31. ueu2  2014.05.20 回复

    我比较喜欢Octopress

    WordPress商业主题站 回复:

    @ueu2, 插队

    余人 回复:

    @WordPress商业主题站, 我也插

给我留言

返回顶部