主题制作

发表于 2022-07-04| 分类于随记 | 随记 | 评论数

参考Hexo文档

一个主题可能会有以下的结构：

.
├── _config.yml
├── languages
├── layout
├── scripts
└── source

_config.yml

主题的配置文件。和 Hexo 配置文件不同，主题配置文件修改时会自动更新，无需重启 Hexo Server。

layout

布局文件夹。用于存放主题的模板文件，决定了网站内容的呈现方式，我选择ejs

scripts

脚本文件夹。在启动时，Hexo 会载入此文件夹内的 JavaScript 文件，请参见插件以获得更多信息。

source

资源文件夹，除了模板以外的 Asset，例如 CSS、JavaScript 文件等，都应该放在这个文件夹中。文件或文件夹开头名称为 _（下划线）或隐藏的文件会被忽略。
如果文件可以被渲染的话，会经过解析然后储存到 public 文件夹，否则会直接拷贝到 public 文件夹。

模板

模板	用途
index	首页
post	文章
page	分页
archive	归档
category	分类归档
tag	标签归档
layout	共用

经理解，就是Hexo将一个博客分成多个页面(和一个网站多个网页一个意思)，每个页面可以共用一个layout文件，
同时每个页面都可以引用局部模版（Partial），引用时还可以传入局部变量。

总的来说，就是在layout文件写每个网页都有的，index，post等文件用途上面有，Partial文件写用于各个网页重复用的代码片段，
然后用到再引用。很简单的样子。感觉差不多也就这样了(小声bb: 本以为很复杂的说,自信点，任何事情都没你想象得那么难)

layout.ejs

<!DOCTYPE html>
<html>
    <%- partial('_partial/head') %>

  <body>
    <%- partial('_partial/header') %>
    <%- body %>
    <%- partial('_partial/footer') %>
    <%- partial('_partial/footjs') %>
  </body>
</html>

post.ejs是每篇文章用的渲染模板。

page.ejs是其他页面用的模板，比如我们要创建一个友链页面，就要在source中创建friends文件夹并创建index.md作为初始文件，然后写一个friends.ejs
在生成时，hexo会用把md放入friends.ejs中的page.more再在page.ejs中引用，并放入layout.ejs生成页面。。。所以page.ejs实际上是自定义页面的共用模板。

如有错误，欢迎指出！

满分是10分的话，这篇文章你给几分，您的支持将鼓励我继续创作！

本文作者: 聆听·彼岸
本文链接: https://ltba.github.io/20220704085054.html
版权声明: 本站未注明转载的文章均为原创,所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议.转载请注明出处!