最近找到一款非常适合自己的导航网站模板,Hugo Theme Start,因为是采用 Hugo 构建的静态网站,理所当然也就是全世界构建速度最快的网站之一,部署地址: https://leftn.com
前言
我之前曾使用 OneNav 作为个人导航网站,但在清理 VPS 时,误将网站给删了,由于没做备份,事后懊恼好久。后来也经常想着重新做个个人网站导航,但没有找到合适的模板,这一拖就是很久。另外,由于在使用 OneNav 过程中,对于免费主题不提供搜索框功能一直耿耿于怀,便没有重新使用 OneNav 的想法。
这次起因是我在操作一个域名 DNS 编辑时,又误删除了几个 NS 记录。主要原因还是个人部署的服务太多、用的域名太杂,经常记不起来到底哪个域名是对应哪个服务。重新整理了一遍后,彻底激起了要再搞个导航网站的想法。
Hugo Theme Start
如果熟悉 Hugo 的朋友会发现,上边这个导航主题名称跟 Hugo 上最热门的 Hugo theme stack 非常像(也就是本博客使用的主题)。但其实这个名字是我故意在蹭后者瞎编的,本文介绍的这款主题官方名称是 HB Start Theme , 只是在 Github 仓库中叫 Theme start 。
主题安装
主题安装可以直接参考 官方教程,总体还是比较简单的。
TIPS
需要注意的问题是,该主题需要用新近版本的 Hugo,最好直接用 Lastest, 我一开始用 0.125.6 是安装失败的。另外,需要安装 Hugo Extended 版本,并安装 Dart-Sass。具体教程在 Hugo 官网 也都有,这里不再复述。
主题配置
这个主题也没有太多东西配置,无非是搜索引擎选择和排序,然后就是导航所需要的网址链接配置。
与一般 Hugo 网站存在区别的是,这款主题并不能直接修改模板,而是需要创建 Hugopress 模块,按 Hugopress 教程 配置。
另外,导航网址所需的 icons 在 Hugomods 中也都能方便找到,不过这也不是必须的,如果所添加网址 favicon 获取都很正常,也可以不用自定义 icons。
简单修改CSS
使用 Hugopress 还是相对麻烦,由于我只需要修改一处 CSS ,按照 Hugo 通用做法更简单。
- 在根目录下创建
static
文件夹,新建css\coustom.css
,内容视自己情况而定。例如,我修改如下内容,避免在网页中间显示滚动条。
|
|
- 在
layouts\partials\hugopress\modules\custom\hooks\head-end.html
中启用自定义 CSS,添加如下代码。
|
|
网站发布
我使用的是 Github Pages 作为发布端,通过 Github Actions 部署。
将本地 start-page 上传到 Github 仓库后,在 Pages 中选择新建一个 Actions 模板,搜索 Hugo 即可自动部署。
需要注意的是,如果一开始部署页面是 <username>.github.io
,在添加自定义域名后,需要重新手动运行一遍 workflow ,不然无法正常加载 CSS 。
Leftn Homepage
简单介绍一下个人导航网站内容。
Hyruo Blog
就是本博客,目前部署在 vercel,同时有两个备份 Hyruo Mirror
分别部署在 Cloudflare Pages 和 VPS 上方便随时切换。其中部署在 VPS 的备份折腾了很久,最后还是在 Hugo 论坛发现有大佬发 部署模板 才搞定。需要注意的是,在后两个镜像上的评论与本站都是通用的。
|
|
Hyruo Status
这是一个网络服务监测程序,使用的哪吒探针,主要用来监测我目前手头上的 4 个 VPS 可用性。
其中两台甲骨文 4核24G内存的 ARM 服务器,分别位于印度海得拉巴、新加坡。一台甲骨文 1核1G 的 AMD 服务器,位于印度海德拉巴。另外有一个 Claw.cloud 位于新加坡的 的 1核1G 小鸡,该公司应该是阿里云的下属网络营销部门创建。
Hyruo Analysis
这是一个网站统计工具,使用 Umami 程序,主要用来分析网站访问情况,不对外开放。
Umami 统计隐私友好、开源、自托管的特点都非常适合个人用户。
Hyruo Browser
这是一个网页版的远程 Firefox 浏览器,个人学习研究使用,不对外开放。
主要是使用方便,但对网络速度有一定要求,如果看视频的话,服务器 CPU 也不能太差。
Hyruo Reader
这是一个在线阅读器,使用 阅读3.0 ,只支持个人使用,不对外开放。
主要是 Windows 上真没好用的电子书阅读器,之前为了看个电子书之前甚至装 Android 模拟器用,后来才发现有 Web 服务器版本。
Hyruo Coding
这是一个远程 Vscode 服务,使用 code-server,只支持个人登录,不对外开放。
比起微软和 Github 提供的服务主要是直连稳定性稍高,而且可以跟 vps 文件互通。
Hyruo Editor
这是一个在线 Markdown 编辑器,使用 StackEdit,可随意使用,数据都保存在本地浏览器。
主要用来在手机上编写 Hugo 博客,只是 图片上传稍复杂 。
Hyruo Chat
这是之前给自己身边亲朋好友搭建的一个类似反代的 Chatgpt 服务,使用 Nextchat,不对外开放。
如今国产大模型已经赶上来了,普通用户直接用国产就行。
Hyruo AI
这是一个给自己使用的 Ai,使用 LobaChat,只支持个人登录,不对外开放。
Hyruo File
这是一个在线网盘应用,使用 Cloudreve,只支持个人使用,不对外开放。
Hyruo Download
这是一个在线存储管理应用,使用 Alist,只支持个人使用,不对外开放。
Hyruo Photo
这是一个在线图床,使用 EasyImage,只支持个人使用,不对外开放。
Hyruo Video
这是一个在线反代应用,使用不可描述程序,只支持个人使用,不对外开放。
个人导航网站有用吗?
可以说有用,也可以说没用。
有用的是,起码能较为固定的把一些链接给固定起来,并直观显示。
没用的是,其实浏览器首页也能起到同样的效果。
区别是,一般浏览器首页快捷位置有限,更适合让位给自己最常用的其他网络平台。
另外,对于各种网络服务的后台管理面板地址等不适合公开的网址,还是得继续用浏览器书签管理。