Hexo自定义页面的两种方法

神采奕奕
• 阅读 5606

原文地址:http://refined-x.com/2017/07/10/Hexo自定义页面的方法/

Hexo是静态页博客生成利器,同很多博主一样,前端路上原创技术博客也是使用Hexo生成并托管在Github Page上的,但在使用Hexo的过程中遇到一个小问题,Hexo默认会对/source/里的所有页面应用主题模板渲染,但有一些前端作品或demo页我们不希望经过渲染,而是能保持完全自定义的样子,那该怎么用Hexo添加自定义的web页面呢?

下面介绍两种方法。

第一种方法是使用Hexo提供的跳过渲染配置,适用于整个目录的设置。具体步骤,打开博客根目录_config.yml,找到其中skip_render项,这个项目用来配置/source/中需要跳过渲染的文件或目录,例如希望跳过/source/projects/里的所有文件渲染,可以配置为:

skip_render: projects/**

匹配规则是一种类似正则的规则,官方给出的参考是这个。另外在测试这个功能的时候发现,Hexo的内部缓存不是特别好用,有时候你修改了配置但生成出来的内容不一定及时应用了新配置,最好在生成之前执行一下hexo clean命令,清除掉旧的生成文件和缓存。

第二种方法是给单个文件添加不应用模板的标记,适用于个别特殊文件的处理。例如我们的网站如果要使用百度统计,往往需要在根目录放一个html格式的验证文件,这个文件默认也会经过用主题模板渲染,避免渲染的办法就是在文件头部添加如下内容:

---
layout: false
---

这样,这个文件就不会经过模板渲染,最终发布到/public/里的文件就是去掉标记后的文件的样子。

点赞
收藏
评论区
推荐文章
Stella981 Stella981
4年前
Hexo 博客快速整合公众号导流工具,不用互推也能实现粉丝躺增!
readmore插件简介!hexopluginreadmorebadge.png(https://oscimg.oschina.net/oscnet/b8aa2f844bcbdc9cb579c8153557e7046a1.jpg)Hexo整合OpenWrite平台的readmore插件,实现博客的
Stella981 Stella981
4年前
Hexo博客主题安装和优化(二)
一、Hexo自定义晚枫博客(https://www.oschina.net/action/GoToLink?urlhttps%3A%2F%2Fwhitesirblog.top%2F)\
Stella981 Stella981
4年前
Hexo NexT 博客与Github page 关联指南
上篇文章 Hexo博客框架NexT主题搭建指南(https://www.oschina.net/action/GoToLink?urlhttp%3A%2F%2Fwww.cnblogs.com%2Fxingyunblog%2Fp%2F8675681.html)我们已经在本地搭建好了Hexo博客框架NexT 主题的博客程序,但是这感觉还是远远不够。
Stella981 Stella981
4年前
Hexo,其实没有你想象的那么难
阅读目录:1.安装hexo所需环境nodejs下载软件解压添加环境变量配置生效2.安装hexo安装初始化生成静态页面安装Git插件配置hexo安装hexo后台
Stella981 Stella981
4年前
Hexo建站过程总结
Hexo是一个基于Node.js快速、简洁且高效的博客框架,可以将Markdown文件快速的生成静态网页,托管在GitHubPages上。由于原来博客的主机费用问题,我没有办法再在那个主机上面再进行博客的更新,实在是太贵了,对于我来说。所以就在GitHub上面开始建站,使用Hexo来搭载我的博客。Hexo和WordPress有很大的不
Stella981 Stella981
4年前
Hexo+NexT(二):Hexo站点配置详解
!精于心简于形(https://oscimg.oschina.net/oscnet/1279fb8cfab2d287b9da4cbe97ec8020876.png)阅读本篇之前,假定读者已经有了Node.js的基础,如需要补充Node.js知识的,请自行百度。Hexo是在Node.js框架下的一个项目,利用Node.js提供
Stella981 Stella981
4年前
Hexo的版本控制与持续集成
想必很多人会把Hexo生成出来的静态网站放到GitHubPages来进行托管。一般发布Hexo博客的流程是,首先在本地搭建Hexo的环境,编写新文章,然后利用hexodeploy来发布到Git。那么对于本地的Hexo的原始文件怎么管理呢?如果换电脑了怎么办?如果没有对原始文件进行备份,突然有一天你的本地环境挂了导致源文件丢失,那不就呵呵了。也许你会想
Stella981 Stella981
4年前
Hexo
动机好久没去Hexo官网(https://www.oschina.net/action/GoToLink?urlhttps%3A%2F%2Fhexo.io%2F)逛逛了,陡然发现有新版本(https://www.oschina.net/action/GoToLink?urlhttps%3A%2F%2Fhexo.io%2Fnews%2F2
Wesley13 Wesley13
4年前
PHP 爬虫体验(二)
自从使用hexo在githubpage更新博客之后,我每次在cnblog上发布文章,需要手动再更新hexo。hexo使用markdown格式来写文章,手动更新需要对文章本身内容进行转化,做成md文件再进行上传,后来就想到,本身爬虫就可以对页面中的各种元素进行提取,同时markdown使用的是标记语法,那么使用爬虫分析文章元素,提取主要内容并且根据模板自动生
Wesley13 Wesley13
4年前
PHP方法参数过多优化方案
!(https://oscimg.oschina.net/oscnet/up4775bb24da1f47f749ba7f724f65466d3a1.JPEG)我们在编写PHP方法时,通常有若干个参数,就像下面的代码:ClassBook{publicfunctioncreate($name,$cateI
Stella981 Stella981
4年前
Hexo 添加自定义的内置标签
灵感  想设计一个记录自已骑行的页面,显示时间、地点、路线图等信息。方便以后做一些留念。定位想实现下面类似的效果。参考:《特效(https://www.oschina.net/action/GoToLink?urlhttp%3A%2F%2Fwww.iissnan.com%2F)》      !(http://notes.r