惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

小众软件
小众软件
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
T
Troy Hunt's Blog
Cloudbric
Cloudbric
Security Archives - TechRepublic
Security Archives - TechRepublic
WordPress大学
WordPress大学
Recent Commits to openclaw:main
Recent Commits to openclaw:main
W
WeLiveSecurity
GbyAI
GbyAI
V2EX - 技术
V2EX - 技术
Latest news
Latest news
Engineering at Meta
Engineering at Meta
TaoSecurity Blog
TaoSecurity Blog
K
Kaspersky official blog
PCI Perspectives
PCI Perspectives
Hacker News - Newest:
Hacker News - Newest: "LLM"
博客园 - 叶小钗
I
InfoQ
Y
Y Combinator Blog
罗磊的独立博客
大猫的无限游戏
大猫的无限游戏
The Register - Security
The Register - Security
U
Unit 42
F
Full Disclosure
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
D
DataBreaches.Net
博客园 - 聂微东
Recorded Future
Recorded Future
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
S
Secure Thoughts
博客园 - Franky
M
MIT News - Artificial intelligence
爱范儿
爱范儿
N
Netflix TechBlog - Medium
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
S
SegmentFault 最新的问题
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
T
Threat Research - Cisco Blogs
腾讯CDC
S
Securelist
P
Proofpoint News Feed
酷 壳 – CoolShell
酷 壳 – CoolShell
AI
AI
Simon Willison's Weblog
Simon Willison's Weblog
Google Online Security Blog
Google Online Security Blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
C
Cybersecurity and Infrastructure Security Agency CISA
Recent Announcements
Recent Announcements
H
Hackread – Cybersecurity News, Data Breaches, AI and More

kok的笔记本

macOS 里 神秘的 kernel_task ,为什么一直在写入硬盘? 产品 node_modules 为什么总是这么大:一次从原理到实践的瘦身记录 谁来救救我的Mac存储空间-清理工具横评:付费vs免费,从界面到命令行 2023 读书推荐 写给播客嘉宾的录制说明书 在 Electron 中使用 Vue Devtools 几何原本中勾股定理的证明 Mac 安装软件时提示 已损坏,无法打开 应该怎么办 PegBoard 你的数字白板 少数派读者与作者的 NewsLetter 闲棋冷子-2-2021年我读过哪些很棒的书 闲棋冷子-1-相信你的身体,它不会骗你 修复 macOS 中 Cisco Anyconnect 报的奇怪Bug 我的 NAS 使用记录 Omniplan 入门教程 Hugo升级0.74记录 一年级产品经理需要掌握什么知识? 无籍之谈-3-和盖盖聊聊尼尔·盖曼与中外科幻 露营笔记-装备篇 无籍之谈-2-和鹏仔聊华尔街兴盛史,给小白投资者的一些建议 介绍一下《无籍之谈》 无籍之谈-1-和不土聊佛学,谈谈《一心走路》《僧侣与哲学家》 高达模型入门 - 工具整理 5 分钟了解 Sketch 的新特性 Tint - 色调 Hugo 主题移动端开发的一些心得 修复 macbook 键盘连击问题 在 Hugo 中使用 Open Graph 提升分享效果 选小米10 还是小米10 Pro? 利用 Python 批量合并 Excel 文件 为什么家国梦不好玩? 高雄85大楼 Mac优秀软件推荐-Itsycal 找到并和正确使用无版权资源 Excel 常用函数 一 无线吸尘器挑选指南 钢铁、蒸汽与 19 世纪 聊聊《铁道之旅》 如何挑选一个电脑电源? 有用的正则表达式 给psd瘦身 2019第二季度读书总结 组装 ITX 黑苹果主机 Intel CPU 挑选指南 常用的 Markdown 工具 2019第一季度读书总结 怎么用尺规作图画75°角? 在 Hugo 中使用 Sass 真正的换位思考-《爱的沟通》读书笔记 Hugo 中使用思维导图 反叛公司中的治理者和顾问玩法 如何搭配成为一个盐系男生? 反叛公司 Rebel Inc. 入门指南 如何评估需求,预估开发成本? 小米8、小米8SE、小米8青春版参数对比 微信外部链接内容管理规范分析 在售 iPhone 参数对比 给Hugo blog中增加一些插件 微信 MacOS 多开的一些实践 矩阵与线性变换的概念理解 尺规作图小习题 用 hugo 和 netlify 搭建blog 介绍我自己 瓜摊老板 Really? EDM邮件营销,你需要知道 果子沟大桥 喀赞其的马车 清晨的木梨硡 青龙寺的狮子 用一个特殊方法解决同位词问题 语义化 html 标签 数模的基本思路和写作攻略 hexo blog 搭建 0.1,0.1^0.1,为什么数值是波动的? 智能手机之旅 老师和学生的博弈 这些使用抗生素的方式,你做的对吗? 炼金术与钢之炼金术师 kok的笔记本 kok的笔记本 中国长征运载火箭家族-PegBoard
hexo 主题开发
kokdemo · 2016-02-04 · via kok的笔记本

hexo作为一个比较受欢迎的静态blog生成器,其个性主题也是比较受大家欢迎的点。只要有一定的js,css,jade的开发栈就可以实现一个功能强大的主题效果。

当然如果要好看则是另外一回事了……

如果你并不想要折腾主题的话,我推荐以下几个有趣强大的主题,直接拖到hexo的theme文件夹就好。(什么,你不会?建议你可以换简单一些的blog,比如wordpress?)

  1. NexT 简洁而强大 https://github.com/iissnan/hexo-theme-next
  2. Jacman 比较俏皮的风格 https://github.com/wuchong/jacman
  3. Apollo 足够简单,我目前用的就是我自己修改过的apollo主题(增强了一点功能,原版的apollo没有tag和category……) https://github.com/pinggod/hexo-theme-apollo

更多的主题见这里 https://hexo.io/themes/

言归正传,因为hexo本身就比较简单,因此分几步来讲:

hexo的路由机制

hexo能够自动解析的页面有

  • index 首页
  • post 文章
  • page 分页
  • archive 日期归档
  • category 分类归档
  • tag 标签归档

这里的每一个页面都对应了主题文件夹下,layout的一个文件。因此建立主题的时候,这些文件都是可选的。当然,index是必选的。

hexo的变量

实际上,如果你就这么简单的创建了文件,并不会加载出文件来,hexo在渲染文件的时候,会根据页面上的一些变量来进行操作。
这部分的内容hexo已经给好了,比如说全局变量就有:

  • site 网站变量
  • page 页面内容
  • config 网站设置,也就是写在_config.yml中的内容
  • theme 主题设置,也就是写在theme/_config.yml中的内容
  • path 页面路径
  • url 完整网址
  • env 环境变量

更多的不在这里赘述,看官方文档 https://hexo.io/zh-cn/docs/variables.html

我就用Apollo的一段模板来解释一下吧。

    //- Post Page
    mixin post(item)
        .post
            article.post-block
                h1.post-title
                    != item.title 
                +postInfo(item)
                .post-content
                    != item.content

其中mixin post(item) 是jade的语法,指重用jade块,这里不详细说了,有兴趣的可以戳 https://cnodejs.org/topic/5368adc5cf738dd6090060f2

这里的参数就是一篇文章post,因此,我们就可以代码块中调用item.title文章标题,item.content文章内容。

同样的,只要我想,我也可以给里面插入item.date页面建立日期,item.updated页面更新日期,item.excerpt页面摘要。

同样的页面,如果在NexT中的写法如下:

这里本来会有NexT的swig代码,然而不知道为什么hexo文章中只要有了这些代码立马报错…… 我也是醉了,就这样吧,关于NexT代码的分析就无疾而终了…… 有兴趣的看这里 https://github.com/iissnan/hexo-theme-next/blob/master/layout/archive.swig

NexT的功能就多很多了,这里读取了页面变量page中的所有文章posts,是一个数组,数组中的每一项都对应着一个文章,所以就可以看到这里读取了post.date作为年份,当然这里使用了一个辅助函数。

我在开发的过程中还找到了一些有用的变量,比如上面说到的 page.posts 中的每一个文章中,都有一个 tags.data 属性,这也是一个数组,可以读取这篇文章中所有的tag名称。 categories属性则是一个对象,可以用foreach的方法进行访问。

hexo的辅助函数

上一段你可能已经看到了date()函数,这就是hexo 提供的辅助函数,比较常用的函数有:

  • url_for() 生成一个全局可用的路径
  • js() 导入一个js
  • image_tag() 插入图片
  • is_home() 判断是不是首页,这类函数还有很多
  • date() 插入格式化的日期
  • tagcloud() 插入标签云

善用这些辅助函数,可以让你少些很多冗余的代码,因此在开脑洞施工之前,先看看这个功能官方是不是已经做了。

那么第一篇就写这么多,更多的也可以看hexo的官网。

祝你折腾的愉快