keep 主题 修复 友链不显示 css 不正常

---

title: keep 主题 修复 友链不显示 css 不正常
date: 2021-06-07 17:10:53
tags:

• Hexo
• keep
• node
  categories: Hexo

---

概要

本来高高兴兴搭建好和朋友挂友链来着,一顿操作.更新好友链页面一片空白…

这是什么道理呢?..天地良心 我可是 git 下来啥也没动哦

---

修复友链

女(程)人(序) 的心思你别猜,来先看看文档!!

keep 友链文档

keep 主要应用到 hexo 提供 _data 功能

_data文件夹 Hexo 给出的解释

个人理解即是: _data 将 信息多,复用多的 资料,配置 抽离出来,方便存储和调用

了解的功能和实现,.现在就开始爬坑吧…

问题:

1. hexo 主题 目录,原理,语法
2. 看看 keep 到底卡那了

hexo 主题 目录,原理,语法

Hexo 主题 文档

Hexo 模板 文档

Hexo 助手函数

过一眼这个三个我们接着往下看

模板文档 这一章节开篇明义

模板决定了网站内容的呈现方式，每个主题至少都应包含一个 index 模板，以下是各页面相对应的模板名

得知 模板必须在 index.ejs 文件做加载

本文已 keep 为例

抽丝剥茧下来 加载顺序为

index -> page

# 文件位置
themes/keep/layout/index.ejs
themes/keep/layout/page.ejs

打开 page.ejs, 似乎没看到 和 Link 渲染有关,代码量不大,

顺下逻辑 真相只有一个 那就是在 _partial/page-template 这个局部模板中

好家伙,我直接好家伙.直接真相

// ... 省略
const isLoadFriendsLink = (
  theme.menu.hasOwnProperty('Links')
  && theme.menu.Links
  && theme.links
  && (page.type === 'links' || page.type === 'link' || page.title === 'links' || page.title === 'link')
);
<% if (isLoadFriendsLink) { %>
  <%- partial('_partial/friends-link') %>
<% } %>
// ... 省略

注意

source/links/index.md 文件的 title 属性不要修改！
友链样式根据 title: links 来匹配！ – 来自 keep 文档

修复结果

const isLoadFriendsLink = (page.title === 'links');

跑起来~ 完美 家人们的链接出现了 等等 好像有新的问题

---

修复 友链 CSS

修复友链显示后 刷新页面 发现 css 错位,

定位 css 加载文件

/项目/themes/keep/source/css/layout/_partial/page-template.styl

# 省略..
if (hexo-config('menu.Links')) {
# 省略..
}
# 省略..

处理方法

删除 if (hexo-config('menu.Links')) { 这个逻辑判断

重新 编译 跑起来 完美