Hexo博客(Snail主题)搭建回顾概览
Hexo博客(Snail主题)搭建回顾概览
笔者搭建博客地址:saltyfishyjk’s Blog
文章目录
- Hexo博客(Snail主题)搭建回顾概览
- Part 0 前言
- 写作背景
- 定位
- 您在这里可以期望获得:
- 您在这里无法期望获得:
- 对读者前置知识的期望
- Part 1 笔者参考的其他博客
- Part 2 笔者踩过的坑
- 设置GitHub默认分支为master
- 直接按照[Snail主题官方仓库(给出了重要基本指导)](https://github.com/dusign/hexo-theme-snail)的README.md搭建博客
- 执行`hexo g -d`时关闭代理
- Part 3 个性化设置博客界面
- 在[Snail主题官方仓库(给出了重要基本指导)](https://github.com/dusign/hexo-theme-snail)已经给出的设置
- 官方指导未给出的设置配置
- 更改右上角导航栏
- 写博客
- 插入图片
- 后记
Part 0 前言
该Part记录一些背景信息,有助于读者了解这篇博客的写作背景、定位、对读者的前置知识期望。建议脑海中只有”想像大家一样搭建hexo博客“的同学阅读本部分,其他同学可直接跳至Part 1开始阅读。
写作背景
笔者在6系第一学期的祭祖中阅读参考了大量的学长学姐和同届大神的博客,受益匪浅,csdn和cnblog都是很不错的适合博客小白的平台,同时易于在百度检索中出现;除此之外,基于github page的hexo博客吸引了我的兴趣,虽不易于百度检索,但是利于对个人博客收集整理,这便是搭建本博客的初衷。
笔者的设备是Windows 10家庭版。
定位
基于这篇博客提供的其他搭建博客详细指导链接和笔者自己的补充,预期读者可以依此搭建属于自己的Snail主题hexo博客。
您在这里可以期望获得:
- 笔者在搭建博客中踩过的坑
- 一些较详细的指导搭建博客链接
- 基于第2条中的搭建博客链接的一些补充
- 包括链接博客内容在内的搭建博客所需的充分知识
- 依照本博客给出的方法搭建出类似本博客的个人博客
您在这里无法期望获得:
- 应用到的技术的深层原理
- Snail主题之外的其他hexo主题博客搭建方法
对读者前置知识的期望
我们希望读者最好可以拥有以下知识,或在阅读本博客时及时查阅学习。
- 了解Git和GitHub基础知识
- 能够应用编辑器(如visual studio code)查看各种非常规类型配置文件
- 能够访问GitHub或能够使用VPN
- 命令行的使用与Linux基本命令
Part 1 笔者参考的其他博客
- Hexo+GitHub Page搭建技术博客(重要参考)
- Snail主题官方仓库(给出了重要基本指导)
- hexo官网(可以获得hexo基本知识如hexo命令等)
- hexo+github搭建博客(超级详细版,精细入微)
- 解决npm install安装慢的问题
- 利用vscode打开.styl文件的办法
- 解决hexo中文博客打不开的问题
- 解决博客中插入图片的问题
以上为笔者在搭建博客的过程中所参考过的其他博客,前两个最为重要,读者可以将本博客与它们结合阅读。
Part 2 笔者踩过的坑
设置GitHub默认分支为master
由于美国的一些政治因素,GitHub在2020年将默认分支由多年来一直使用的master改为了main,这导致了学习2020年10月之前的博客教程时,现在的用户需要考虑默认分支不同导致的潜在问题。因此,直接将自己GitHub账户的默认分支改为master即可与大家保持一致,避免无谓的bug。
直接按照Snail主题官方仓库(给出了重要基本指导)的README.md搭建博客
笔者曾尝试先应用默认主题,再更换为snail主题的方法,但是由于未知原因一直失败,但直接按照snail主题给出的指令操作即可。因此,建议读者直接按此操作。
执行hexo g -d
时关闭代理
在此先推荐一款访问GitHub的工具DevSideCar,傻瓜式操作非常易用。
在使用DevSideCar时,可能会遇到执行hexo g -d
命令时上传失败,这并非因为操作错误,而是因为网络原因,只需要关闭代理即可。
Part 3 个性化设置博客界面
如果你完全按照上文及相关链接的操作进行,那么下面的操作对你应当是适用的。
在Snail主题官方仓库(给出了重要基本指导)已经给出的设置
- 修改Site,按照官方指导即可。
- 修改Site Settings,其中的
img
文件夹的相对地址是blog\source\img
,其中blog
是官方指导最开始的hexo init blog
命令生成的blog
文件夹。在该img文件夹下放入你所想要的图片并修改配置文件中相应代码。 - 修改SNS Settings,按照官方指导即可。
- 修改Sidebar Settings,对于不需要的Sidebar,直接注释掉或删掉对应栏目即可;friends链接的
title
是在你的博客界面显示的文字,点击会跳转到href
指向的链接。
- 修改Sidebar Settings,对于不需要的Sidebar,直接注释掉或删掉对应栏目即可;friends链接的
- theme部分应该无需自己修改。
- Deployment部分依照官方指导修改即可,其具体格式可进一步参考Hexo+GitHub Page搭建技术博客(重要参考)。
- Background effects部分按照官方指导修改即可,也可以关闭以减少CPU消耗,其中content部分可以修改为自己喜欢的emoji或语句,做个小彩蛋(比如本博客[doge])。
官方指导未给出的设置配置
更改右上角导航栏
例子:如想删去下图右上角的TAGS栏目,只需要在blog\source
目录下山区tags
文件夹即可。
如果想增加栏目,可以查阅hexo命令hexo new page使用方法,此处不详述。
写博客
可以使用hexo new 'title'
的命令生成.md
博客源文件,在其中使用markdown
语法书写即可。
插入图片
参考解决博客中插入图片的问题中的方案,其中前两种方法笔者已经亲测可用,最后的typora的方法没有尝试。
后记
感谢您阅读至此,这篇博客到此也就告一段落了,后续笔者若有新的心得会更新本博客。
这篇博客远非尽善尽美,笔者也只是提供了若干其他博客资源和自己亲历的坑,若有不足之处还望批评指正。
Hexo博客(Snail主题)搭建回顾概览相关推荐
- hexo博客next主题添加对数学公式的支持
hexo博客默认为markdown格式,但是新搭建的hexo博客不支持公式渲染,下面介绍hexo博客next主题下添加对数学公式支持的方法. 环境说明: hexo版本:5.4.1 next版本: 最新 ...
- hexo博客yilia主题_缺失模块_解决方案
hexo博客yilia主题,左侧栏目有一个全部文章的按钮,刚开始开始报错缺失模块,如下图: 我解决了这个问题着实不容易饶了弯路,但是跟着提示步骤,其实很简单,走起: 1.查看node版本 win键+R ...
- Github pages + Hexo 博客 yilia 主题使用畅言评论系统
文章首发地址:http://www.54tianzhisheng.cn/2017/04/13/Hexo-yilia-changyan/ , 转载请注明出处. 前言 Hexo的Yilia主题由于原来使用 ...
- hexo 博客next主题集成gitment或者gitalk评论系统
原文链接hexo 博客next主题集成gitment或者gitalk评论系统 前言 之前使用多说,多说挂了,用网易跟帖代替,网易跟帖又没了.前段时间用来必力,感觉还行,但总归不踏实.后面发现有gitm ...
- 为Hexo博客next主题添加友链
为Hexo博客next主题添加友链 20230427153826|left
- hexo博客yilia-plus主题更换Beaudar评论插件
文章目录 hexo博客yilia-plus主题更换Beaudar评论插件 一.安装Beaudar app. 二.添加到主题中 1.直接拉取仓库到本地. 2. 自己进行配置 三. 一些问题 hexo博客 ...
- hexo博客yilia主题 如何自定义个人博客的背景图片
hexo博客yilia主题 博客背景的设置 个人博客系列文章目录 hexo博客yilia主题 所有文章模块缺失最新解决方案 hexo+yilia博客报错post.categories forEach ...
- hexo博客 Maupassant主题 添加萌妹纸、萌宠
给hexo博客养一个 萌妹子或者萌宠,也是偶然之间发现可以添加可爱的妹纸或者是萌宠,发现挺好玩的,而且作者提供了很多模型供你选择,没事的时候还可以逗一逗 ? 文章目录 本博文的简述or解决问题? 获取 ...
- 02 Hexo博客Butterfly主题配置博客评论邮件提醒
概述 个人博客搭建成功后已经上线运行了好久,但是一直没有时间配置评论区的邮件提醒功能,所以今晚有时间就抽空配置了,然后将操作过程做一下记录. 前提条件 一个已经上线运行的Hexo博客(至于用什么主题都 ...
- GitHub+HEXO博客更换主题
写在前面 前面讲了怎么使用GitHub+HEXO搭建论坛,这里写这个论坛如何更换主题.对于如何安装HEXO和部署到GitHub的问题,见我另一篇文章使用GitHub+HEXO免费搭建个人博客(最详细) ...
最新文章
- 在代码段中安排自己定义的数据
- WordPress博客后台不能显示所有主题和无法编辑主题的问题的解决方法
- 现代软件工程系列 学生的精彩文章 (1)
- 深入理解Tomcat和Jetty源码之第二篇servlet规范和servlet容器
- SAP License:FICO重要概念(二)-附常用技巧
- jsp+servlet实现文件的上传和下载
- Android,iOS打开手机QQ与指定用户聊天界面
- 高中计算机技术教材,广西科学技术出版高中信息技术教材第一册《计算机硬件组成》...
- Vue学习之旅----vuex不同组件间数据共享-状态一致
- BOMAPI和DOMAPI
- 手机浏览器 css3,css3在不同型号手机浏览器上的兼容一览表
- 打字游戏之输入框功能的实现
- python控制相机自动拍照_如何让VPython中的对象自动移动到相机中?
- 未加载coreavcdecoder.ax所用的符号
- iOS -- masonry的使用
- 【全奖博士】香港大学招收计算机视觉方向博士/博后/研究助理
- xshell xftp 5系列
- 越客汽车美容管理软件 汽车行业专用软件
- USB Gadget iMX6UL开发板模拟U盘
- 华为笔试题-素数伴侣