hexo建站详解----jade 。swig。ejs模板使用 hexo favicon设置
2017-09-20 10:41
501 查看
jekyll也搞过,最后转到hexo上。
原文:
hexo中文详细文档:https://hexo.io/zh-cn/docs/index.html
使用hexo,最好还要看看这里:http://theme-next.iissnan.com/faqs.html
需要注意的是,Hexo 3.1.1测试的最低版本为0.12,所以安装的版本不要太旧,之前看到网上装的0.8.4的版本,我也这么装,结果有一大堆的报错。
可以去Github官网上去注册,注册的过程我就不罗嗦了,具体的过程可以去这个页面上跳到Github的那部分去看。
其中配置SSH Keys的那部分,可以选择不配制,不配置的话以后每次提交的时候就需要手动输入账号密码,如果配置了的话就不需要了。
来安装
然后进入你要安装的目录,如
然后安装
安装好之后不要忘记执行
至此,就已经安装完毕了。是不是很简单呢?
其中postName是博客名。
或者也可以执行缩写
或缩写
看到 INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop. 之后,就可以在浏览器中打开页面http://localhost:4000来看了。
在确认之后,就可以执行命令
来安装插件
翻到最后,找到 deploy 字样,改成如下格式:
需要注意的是:冒号后面有一个空格;使用github可以不用写branch那一行。
如果要使用多个 deployer,可改成如下样式:
或者缩写
来执行。
以后每次执行就可以依次输入下面三行命令:
或者其缩写。
对于下载的jade的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-jade。。终端下输入
对于下载的Ejs的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-ejs。终端下输入:
对于下载的Haml的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-haml。终端下输入:
(注意后缀)
我的是<link rel="icon" type="image/x-icon" href="<%- theme.favicon %>"> 不修改,好像也可以。。只是把favicon.ico放到hexo\source目录下了。
你懂的,将你的favicon.ico放到工程根目录下即可,也就是hexo\source目录。可以在线制作你的ico图标。
原文:
hexo中文详细文档:https://hexo.io/zh-cn/docs/index.html
使用hexo,最好还要看看这里:http://theme-next.iissnan.com/faqs.html
前期准备
安装Xcode
Hexo的编译可能依赖Xcode。这个直接从App Store上下载就好了,没什么难度。安装node.js
Hexo是基于node.js的,所以要去官网上下载下来安装。版本可以选择稳定版(4.3.1)也可以选择最新版(5.7.0)。需要注意的是,Hexo 3.1.1测试的最低版本为0.12,所以安装的版本不要太旧,之前看到网上装的0.8.4的版本,我也这么装,结果有一大堆的报错。
注册Github账户
在本地搭建好Hexo后可以将内容同步到github上,可以在网上浏览。可以去Github官网上去注册,注册的过程我就不罗嗦了,具体的过程可以去这个页面上跳到Github的那部分去看。
其中配置SSH Keys的那部分,可以选择不配制,不配置的话以后每次提交的时候就需要手动输入账号密码,如果配置了的话就不需要了。
正式安装
因为安装包中有些内容在墙外,所以可以换淘宝源,或者用npm install -g hexo-cli --no-optional
来安装
然后进入你要安装的目录,如
cd ~/Document/hexo
然后安装
hexo init
安装好之后不要忘记执行
npm install
至此,就已经安装完毕了。是不是很简单呢?
后期部署
添加文章
hexo new "postName"
其中postName是博客名。
生成静态页面
hexo generate
或者也可以执行缩写
hexo g
本地启动
执行好上面的命令之后就可以在本地启用服务来看效果了。执行下面的命令:hexo server
或缩写
hexo s
看到 INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop. 之后,就可以在浏览器中打开页面http://localhost:4000来看了。
上传至Github
安装git部署插件
在部署之前,首先我们要确认在你的Github帐号的Repository中有 用户名.github.io 的项目。在确认之后,就可以执行命令
npm install hexo-deployer-git --save
来安装插件
配置 _config.yml 文件
在Hexo安装的目录,如 ~/Document/hexo 中找到 _config.yml 文件。打开。翻到最后,找到 deploy 字样,改成如下格式:
deploy: type: git repo: https://github.com/用户名/用户名.github.io.git branch: master
需要注意的是:冒号后面有一个空格;使用github可以不用写branch那一行。
如果要使用多个 deployer,可改成如下样式:
deploy: - type: git repo: - type: heroku repo:
同步
输入命令hexo deploy
或者缩写
hexo d
来执行。
以后每次执行就可以依次输入下面三行命令:
hexo clean hexo generate hexo deploy
或者其缩写。
模板:
layout布局文件夹中。用于存放主题的模板文件,决定了网站内容的呈现方式,Hexo 内建 Swig 模板引擎,您可以另外安装插件来获得 EJS、Haml 或 Jade 支持,Hexo
根据模板文件的扩展名来决定所使用的模板引擎。
对于下载的jade的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-jade。。终端下输入npm install hexo-renderer-jade --save
对于下载的Ejs的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-ejs。终端下输入:
npm install hexo-renderer-ejs --save
对于下载的Haml的模板,需要在安装插件,地址:https://github.com/hexojs/hexo-renderer-haml。终端下输入:
$ npm install hexo-renderer-haml --save
一、网站图标
看一下hexo\themes\modernist\layout\_partial\head.ejs,找到这句:<link rel="icon" type="image/x-icon" href="<%- config.root %>favicon.ico"> |
我的是<link rel="icon" type="image/x-icon" href="<%- theme.favicon %>"> 不修改,好像也可以。。只是把favicon.ico放到hexo\source目录下了。
你懂的,将你的favicon.ico放到工程根目录下即可,也就是hexo\source目录。可以在线制作你的ico图标。
相关文章推荐
- Jade模板引擎使用详解
- 详解在express站点中使用ejs模板引擎
- nodeJS的主流模板----jade和ejs的使用
- 使用Eclipse设置Java注释模板详解
- 使用证书设置SQL Server数据库镜像详解
- crontab命令设置使用详解
- Eclipse中设置方法注释模板并使用方法注释
- 详解FCKeditor文本编辑器在.NET环境下的设置和使用
- Eclipse Java注释模板设置详解
- 使用Web标准建站第5天:head区的其他设置
- SVN使用详解之如何设置svn:keywords
- windows驱动开发技术详解 VC6与DDK搭配使用的设置
- 详解CentOS5.4设置使用rpmforge(packages.sw.be)yum源
- Eclipse/MyEclipse Java注释模板设置详解
- Eclipse Java注释模板设置详解
- 创新声卡KX驱动调试设置及效果器使用详解
- (转)详解FCKeditor文本编辑器在.NET环境下的设置和使用!
- 使用Web标准建站:head区的其他设置
- 详解FCKeditor文本编辑器在.NET环境下的设置和使用!
- Eclipse Java注释模板设置详解