Hexo优化实验

发表于 | 更新于: | | 阅读次数:
字数统计: 413 | 阅读时长 ≈ 2

用于记录不知道怎么优化的问题，和记录被改过的部分。

以下是希望有的功能，但是目前还不知道如何实现

  • [x] 去掉图片周围的边框
    进入目录themes\next\source\css\_common\components\post，打开文件post-expand.styl，搜索找到img，修改变量border后面的颜色编码，原是#ddd，改完之后是#FFF
  • [ ] 图片不用总是居中显示
  • [ ] 代码折叠
  • [ ] 多选择流程图绘画
  • [ ] 复选框功能

修改了折叠样式

在themes\next\source\css\_custom\custom.styl中增加了一部分代码，使得在about页面可以隐藏一份简历，代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/*去掉自带的小三角*/
details summary::-webkit-details-marker {
  display: none;
}
/*自定义图标，可用图片或字符,如果使用图片，请把content的值设置成空字符*/
/*展开*/
.menu summary:before {
     content: "--";
     /*background: url(../Images/right.png) no-repeat center center;*/ /*收起时的图片*/
     /*vertical-align: middle;*/
}
/*收起*/
.menu[open] summary:before {
    content: "--";
    /*background: url(../Images/down.png) no-repeat center center;*/ /*展开时的图片*/
}

底部#改为标签

修改模板/themes/next/layout/_macro/post.swig，搜索 rel="tag">#，将 # 换成<i class="fa fa-tag"></i>

隐藏网页底部powered By Hexo / 强力驱动

打开themes/next/layout/_partials/footer.swig,使用注释相关的代码即可，或者直接删除。位置如图：

修改网页底部的桃心

还是打开themes/next/layout/_partials/footer.swig，找到图标代码，然后修改图标：
image

自定义鼠标样式

打开themes/next/source/css/_custom/custom.styl,在里面写下如下代码:

1
2
3
4
5
6
7
// 鼠标样式
  * {
      cursor: url("http://om8u46rmb.bkt.clouddn.com/sword2.ico"),auto!important
  }
  :active {
      cursor: url("http://om8u46rmb.bkt.clouddn.com/sword1.ico"),auto!important
  }