搭建属于自己的导航网址-无后台且不需要修改 html

251次阅读
没有评论

共计 1460 个字符,预计需要花费 4 分钟才能阅读完成。

如果你也想非常简单的搭建一个像这样的简洁耐看又实用导航网站,或者这篇文章将会对你有帮助。

搭建属于自己的导航网址-无后台且不需要修改 html

简介

hausen1012/webstack 这是一个根据 WebStack-Hugo 制作的镜像,使用 hugo 来搭建的原因是,不想需要后台来管理,不想依赖数据库!!!

此外,为了更方便获取目录网站的 favicon 图标,镜像内部封装了获取的 api。

搭建属于自己的导航网址-无后台且不需要修改 html

例如:获取百度的 favicon.ico,只需要访问 https://nav.www.amjun.com/get.php?url=www.baidu.com 即可。

hugo 使用的是 yml 的配置文件来管理链接,如:

- taxonomy: 常用推荐
  icon: far fa-star
  links: 
    - title: 语雀
      logo: 语雀.jpg
      url: https://www.yuque.com/
      description: 专业的云端知识库。
    - title: QQ 邮箱
      logo: qq邮箱.png
      url: http://mail.qq.com/
      description: 腾讯 QQ 邮箱。

而导航内容就是根据上面的配置生成。

如果熟悉 hugo 的话,应该知道 hugo 是一个 go 语言编写的静态网站生成器。那么是静态页面的话,将生成的页面放在 nginx 下即可运行。

那么如果配置修改了该怎么做呢?

很简单,生成新的静态文件,将原来的文件替换掉,使用 docker 启动的话,只需要一条命令docker exec -it nav refresh。在这之前需要做的也仅仅是将需要映射的文件映射出来。

下面就来说说具体的搭建步骤。

安装步骤

如果你仅仅想先看看效果,运行命令 docker run -d -p 8080:80 --name nav hausen1012/webstack 即可。

下面是为了目录映射,方便修改文件。

1、拷贝容器内的配置文件

# 创建配置文件存放目录
mkdir -p /home/docker/nav/ && cd /home/docker/nav/
# 复制容器内的配置文件到宿主机,方便持久化修改配置
docker run -d --rm --name nav hausen1012/webstack && \
docker cp nav:/nav/config.toml . && \
docker cp nav:/nav/data . && \
docker cp nav:/nav/themes/webstack/static/assets/images/ . && \
docker rm -f nav

config.toml 是 hugo 的主要配置文件,可以配置网站名称,网站logo,预加载动画,背景图等等。

data 目录下存放的是网址,友情链接,header 的配置文件。

images 是网站图片存放的地址,可以将 logo,ico 图标放在这里。需要注意的是,ico 文件需要放在 images 目录下的 logos 目录下。

2、启动容器

docker run -d \
-p 8080:80 \
-v /home/docker/nav/config.toml:/nav/config.toml \
-v /home/docker/nav/data:/nav/data \
-v /home/docker/nav/images:/nav/themes/webstack/static/assets/images/ \
--restart always \
--name nav \
hausen1012/webstack

这里没什么好说的,主要是把容器启动起来。

刷新

上面启动好就已经可以正常访问了,但是如果进行修改了配置,页面并不会更新。运行如下命令即可:

docker exec -it nav refresh

提醒:本文发布于675天前,文中所关联的信息可能已发生改变,请知悉!

AD:【腾讯云服务器大降价】2核4G 222元/3年 1核2G 38元/年
正文完
 
阿蛮君
版权声明:本站原创文章,由 阿蛮君 2022-09-19发表,共计1460字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)
Copyright © 2022-2024 阿蛮君博客 湘ICP备2023001393号
本网站由 亿信互联 提供云计算服务 | 蓝易云CDN 提供安全防护和加速服务
Powered by Wordpress  Theme by Puock