Hexo NexT主题配置补遗

说明

前些天刚学着用Github+Hexo搭建了自己的博客,选了广受欢迎的NexT主题。配置主题的时候遇到了许多问题。好在网上有各个dalao们的文章铺平道路,否则必然会折腾得死去活来。
dalao们也许是万能的,但总归有涉及不到的地方,本文就一些网上没有提到的配置问题稍作补遗。

修改底部logo栏中的爱心图标

关于修改底部的logo栏的详细内容可转到

Hexo-Next底部powered by的logo栏更改以及注意事项

而要修改年份和作者中的爱心图标:

通用方法

打开\themes\next\layout\_partials\footer.swig
找到

1
<span class="with-love"> <br> <i class="fa fa-heart"></i> <br></span>

把中间的<i class="fa fa-heart"></i>改成你想要的fontawesome图标
如修改成

1
<span class="with-love"> <br> <i class="fa fa-sun-o"></i> <br></span>

就可以成为一名伟大的太阳骑士!

新版方法

打开\themes\next\_config.yml
找到

1
# icon between year and author @Footer <br>authoricon: heart

把heart改成你想要的fontawesome图标名如:sun-o

fontawesome图标库

背景动效和优化手机端显示

关于添加背景动效的详细内容可转到

搭建博客使用hexo的next主题如何添加动态背景

问题

添加背景动效以后,从手机端看起来会显得十分杂乱无章,线条也有些模糊。推荐改成白色背景使页面变得简洁。

方法

使用的是Pisces主题

打开\themes\next\source\css\_schemes\Pisces\_layout.styl
找到.content-wrap

1
+mobile() { <br>width: 100%; <br>padding: 20px; <br>min-height: auto; <br>border-radius: initial; <br>}

大括号内添加一行background : white;

使用的是Muse主题

打开\themes\next\source\css\_schemes\Muse\_layout.styl
找到.header-inner, .container .main-inner, .footer-inner

1
+mobile() { <br>width: auto; <br>}

大括号内添加一行background : white;

增加百度HTTPS搜索引擎验证

关于增加搜索引擎验证的详细内容可转到

HEXO next 主题增加搜索引擎验证

百度现在支持https网址的验证,打开HTTPS认证
按网页提示步骤操作,获得验证信息。
然后,打开themes/next/layout/_partials/head.swig
找到

1
{% if theme.baidu_site_verification %} <br><meta name="baidu-site-verification" content="度娘爱你喔" /> <br>{% endif %}

用验证的信息补全。
并打开themes/next/_config.yml,添加一行baidu_site_verification: true
在度娘的页面上进行验证即可。


Hexo NexT主题配置补遗
https://rainyiris.cc/2016/01/08/Hexo-NexT Theme Settings/
作者
姚麟
发布于
2016年1月8日
许可协议