其实就是改写一下css 个人觉得在移动端还是比较需要目录的
主要涉及/themes/next/source/css/_common/components/sidebar/
目录下文件的修改
效果可见本博客移动端页面
Step 0
确保你拥有一个以NexT为主题的Hexo博客 版本大概任意orz
Step 1
使用文本编辑器打开/themes/next/source/css/_common/components/sidebar/sidebar.styl
在.sidebar
下将+tablet()
和+mobile()
注释掉
1 | /*+tablet() { |
Step 2
在移动端启用目录按钮
使用文本编辑器打开/themes/next/source/css/_common/components/sidebar/sidebar-toggle.styl
在.sidebar-toggle
下将+tablet()
和+mobile()
注释掉即可
为了适配移动端,我微调了部分css如下:
1 | +tablet() { |
Step 3
在移动端启用回到顶部按钮
使用文本编辑器打开/themes/next/source/css/_common/components/back-to-top.styl
在.back-to-top
下将部分代码修改如下:
1 | +mobile() { |
完成
*注:个人预计在小屏移动端可能会出现适配不良的情况;以及友链较多的博客慎用,可能会产生向下溢出?