0%

为 Next 主题增加「Hosted by Coding Pages」

本文参与 Coding 征文计划

之前博客一直在 Github Pages 中,但是遇到速度、百度 SEO、不支持 HTTPS 等等问题,因此准备迁移至 Coding Pages 中,由于不想有三秒的跳转,因此给博客添加「Hosted by Coding Pages」文本。

目标:通过 Next 主题配置文件开关「Hosted by Coding Pages」文本的显示。

最终效果:

Step1. 添加配置项

在 Next 的主题配置文件(themes/next/_config.yml)中增加配置项

打开配置文件,在文件的任意位置(推荐放置于 copyright 配置下面)添加以下行

1
2
# Footer `Hosted by Coding Pages`
coding: true

Step2. 添加文本项

在 Next 的页脚配置文件(themes/next/layout/_partials/footer.swig)中,找到 theme-info 块,在其后添加以下内容

1
2
3
4
5
{% if theme.coding %}
<div class="coding-pages">
<p>Hosted by <a href="https://pages.coding.me" style="font-weight: bold">Coding Pages</a></p>
</div>
{% endif %}

Step3. 设置样式

themes/next/source/css/_common/components/footer/footer.styl 文件中

将以下部分

修改为

欢迎关注我的其它发布渠道