hexo

[TOC] 本文介绍对开发小白也毫无压力的hexo静态博客建站全攻略， github.io 与 coding.me 的静态博客类似，3年前本人基于本机 Windows 在 github.io 上创建了静态 Github Pages - yanglr ，本文以在 Coding pages 上建站为例。 基本原理 配置区 : 用于 hexo 博客的配置，成功部署后原 hexo init 产生的目录下会生成一个 public 的文件夹。 发布区 : 事实上，这一部分就是由 配置区 生成的 public 文件夹中的内容。 发布区的代码必须是公开的，配置区的代码看需要了，如果 git 部署时使用的是 repo: https://用户名:密码@仓库地址 这种方式，如果也 push 到公开代码的仓库就会泄漏个人密码了，所以建议配置在自己的电脑上进行，或使用 ssh key 的形式代替明文密码。 方法1 - 本机Windows下建站 (力荐) 下载安装 node.js 到 官网 下载 nodejs 的最新 LTS 版安装即可。 用管理员权限打开命令行，安装 hexo-cli 和 hexo $ npm install hexo-cli -g $ npm install hexo --save 如果安装速度很慢，可以考虑先换淘宝镜像源: $ npm install -g cnpm --registry

前言 之前我们把hexo托管在github，但是毕竟github是国外的，访问速度上还是有点慢，所以想也部署一套在国内的托管平台，之前查资料听说gitcafe,但是听说gitcafe已经被coding收购了，所以就决定部署到coding。 查询了多方资料，终于鼓捣出了本地一次部署，同时更新到github以及coding。 正文 _config.yml配置 想要同时部署到2个平台，就要修改博客根目录下面的_config.yml文件中的deploy如下 根据Hexo官方文档需要修改成下面的形式 deploy: type: git message: [message] repo: github: <repository url>,[branch] gitcafe: <repository url>,[branch] 所以我的是这样： deploy: type: git repo: github: git@github.com:tengj/tengj.github.io.git,master coding: git@git.coding.net:tengj/hexoblob.git,master 这里要注意一下：上面这段代码左边的-号只能有2个(如下图红圈)，如果超过2个一般就是会被认定为填写格式有问题。我是在repo下面两行用tab键缩进就行，之前没注意这里一直报错。

首先这是一篇自吹自擂的文章，主题是由多位非前端程序员共同开发，目前经过一年半的迭代已经到达 v1.8.0 版本，并且获得大量认可，甚至某大厂员工已经选用作为内部博客，因此我决定写这篇文章向更多人安利它。 什么是 Hexo ？ Hexo 是一个快速、简洁且高效的博客框架，基于 Node.js 开发。Hexo 使用 Markdown 解析文章，并生成静态页面，非常便于静态部署和加载，许多人把页面存在 GitHub Pages 或 OSS 上，连服务器都省了。 Hexo 开发社区也非常活跃，贡献了有 300 多款可选插件，实现了包括自动部署、自动提交搜索引擎、自动提交图床等大量自动化功能。 关于 Hexo 主题 由于 Hexo 框架非常轻量，只包含静态页面的生成，以及文章的分类页，甚至没有后台管理，但简约的框架总能激发开发者们的开发欲望，于是大量形态各异的主题诞生了，目前官方收录了 300 多款主题。 其中比较老牌并且用户量最多的是 Next 主题，你就算不知道这个名字，也一定见过它的样式，如下图： 不要小看这黑白外表，这款主题已经迭代到 7.7 版本，前后两位大佬负责开发维护，现在的维护者 stevenjoezhang 已经贡献了 13 万行代码！ 所以主题看上去只是换皮肤，但自由发挥起来也是撸码无底洞。 我们也开发了主题 虽然目前已经有诸如 Next 这种老牌且功能强大的主题

首先这是一篇自吹自擂的文章，主题是由多位非前端程序员共同开发，目前经过一年半的迭代已经到达 v1.8.0 版本，并且获得大量认可，甚至某大厂员工已经选用作为内部博客，因此我决定写这篇文章向更多人安利它。 什么是 Hexo ？ Hexo 是一个快速、简洁且高效的博客框架，基于 Node.js 开发。Hexo 使用 Markdown 解析文章，并生成静态页面，非常便于静态部署和加载，许多人把页面存在 GitHub Pages 或 OSS 上，连服务器都省了。 Hexo 开发社区也非常活跃，贡献了有 300 多款可选插件，实现了包括自动部署、自动提交搜索引擎、自动提交图床等大量自动化功能。 关于 Hexo 主题 由于 Hexo 框架非常轻量，只包含静态页面的生成，以及文章的分类页，甚至没有后台管理，但简约的框架总能激发开发者们的开发欲望，于是大量形态各异的主题诞生了，目前官方收录了 300 多款主题。 其中比较老牌并且用户量最多的是 Next 主题，你就算不知道这个名字，也一定见过它的样式，如下图： 不要小看这黑白外表，这款主题已经迭代到 7.7 版本，前后两位大佬负责开发维护，现在的维护者 stevenjoezhang 已经贡献了 13 万行代码！ 所以主题看上去只是换皮肤，但自由发挥起来也是撸码无底洞。 我们也开发了主题 虽然目前已经有诸如 Next 这种老牌且功能强大的主题

我属于外貌协会中偏理性的一类人，对于自己博客界面当然也不会例外，谁不喜欢嫩嘟嘟水灵灵的皮肤呢，一款好的样式更能激起我阅读更新博客的兴趣，这种来自于外在的客观刺激是不容小觑的。所有这次对博客园的主题来了一次大改造. 风格预览 既然我们的是技术型文章的博客(😂我的是学习笔记), 就要选择一种看上去很 Geek 的博客框架, 所以我选中了 hexo下的light主题 , 把我们博客园的主题改成light风格 主页如图: 文章页如图: 具体的可以到我的 博客园 预览 整体样式 博客园后台->设置->选择LessIsMore皮肤->定制css代码->禁用模板默认样式 @font-face { font-family: 'FontAwesome'; font-style: normal; font-weight: normal; src: url("//blog.zhaishidan.cn/css/font/fontawesome-webfont.eot?#iefix") format('embedded-opentype'), url("//blog.zhaishidan.cn/css/font/fontawesome-webfont.woff") format('woff'), url("//blog.zhaishidan.cn/css/font/fontawesome-webfont

整理了一波技术写作作者/博主需要的超好用的工具！！！ OpenWrite OpenWrite.CN 坚决支持与助力原创博主的内容输出 助力博主运营，一文多发平台：CSDN、博客园、思否、开源中国、掘金等一键搞定！ 一键复制到微信公众号！支持原创、抵制抄袭 博客建站 Hexo： https://hexo.io/ WordPress： https://zh-cn.wordpress.com/ Ghost： https://ghost.org/ 博客群发、一文多发 OpenWrite： https://openwrite.cn/ 配色工具 网站配色： http://www.peise.net/tools/web/ 图片工具 在线水印管家： https://www.apowersoft.cn/online-watermark-remover 超强图片压缩： https://tinypng.com/ 二维码生成器 草料二维码生成器： https://cli.im/ 微微在线二维码生成器： http://www.wwei.cn/ 联图网二维码生成器： https://www.liantu.com/ 免费的图片素材 泼辣有图： http://www.polayoutu.com/collections Hippopx： https://www.hippopx.com/zh/ Pickpik：

整理了一波技术写作作者/博主需要的超好用的工具！！！ OpenWrite OpenWrite.CN 坚决支持与助力原创博主的内容输出 助力博主运营，一文多发平台：CSDN、博客园、思否、开源中国、掘金等一键搞定！ 一键复制到微信公众号！支持原创、抵制抄袭 博客建站 Hexo： https://hexo.io/ WordPress： https://zh-cn.wordpress.com/ Ghost： https://ghost.org/ 博客群发、一文多发 OpenWrite： https://openwrite.cn/ 配色工具 网站配色： http://www.peise.net/tools/web/ 图片工具 在线水印管家： https://www.apowersoft.cn/online-watermark-remover 超强图片压缩： https://tinypng.com/ 二维码生成器 草料二维码生成器： https://cli.im/ 微微在线二维码生成器： http://www.wwei.cn/ 联图网二维码生成器： https://www.liantu.com/ 免费的图片素材 泼辣有图： http://www.polayoutu.com/collections Hippopx： https://www.hippopx.com/zh/ Pickpik：

一、Hexo自定义 --- 晚枫博客 --- 1. 动态标题 打开博客主题文件夹，路径： themes/matery/layout/layout.ejs ，在对应位置添加如下代码： <script type="text/javascript"> var OriginTitile = document.title, st; document.addEventListener("visibilitychange", function () { document.hidden ? (document.title = "写离开页面标题显示的内容", clearTimeout(st)) : (document.title = "写进入页面标题显示的内容", st = setTimeout(function () { document.title = OriginTitile }, 3e3)) }) </script> 2. 修改导航栏颜色以及透明效果 打开 themes/matery/source/css/matery.css 文件，大约在250行，有一个 .bg-color 属性，修改其属性值即可，代码如下： .bg-color { background-image: linear-gradient(to right, #4cbf30 0%, #0f9d58 100%); /

来源： oschina 链接： https://my.oschina.net/u/4382386/blog/4254126

github + hexo 搭建博客 大学时搭建过 github 博客，但是后来没怎么弄了。感觉有点折腾，就没有继续维护了，今天再来重新搭建一个博客。本文记录搭建操作。 <!--more--> 预备知识： npm 命令； git 命令 github 常见操作 环境要求： node git 我的环境： $ git version git version 2.15.1.windows.2 $ node -v v8.11.1 $ npm -v 6.4.0 安装 hexo npm i -g hexo-cli 在某个文件夹内初始化 hexo 博客所需要的文件 mkdir myBlog # /e/HexoPages 新建一个文件夹 cd myBlog npm i # 安装npm 依赖 得到如下目录： ├── _config.yml # 网站的配置信息，您可以在此配置大部分的参数。 ├── package.json ├── scaffolds # 模版文件夹 ├── source # 资源文件夹，除 _posts 文件，其他以下划线_开头的文件或者文件夹不会被编译打包到public文件夹 | ├── _drafts # 草稿文件 | └── _posts # 文章Markdowm文件 └── themes # 主题文件夹 本地预览博客： hexo s 打开 http://localhost