HomePage导航栏安装配置

李文乐
发布于 2024-06-07 / 1419 阅读
0
0

HomePage导航栏安装配置

安装过程中遇到问题请加Q群:710379957

一、容器介绍

  • 快速搜索、书签、天气支持、广泛的集成和小部件、优雅而现代的设计以及对性能的关注等功能

  • 将所有的服务集成到一个页面,即点即达

二、容器安装
homepage01.png
homepage02.png
homepage03.png
homepage04.png
homepage05.png

镜像名称:ghcr.io/gethomepage/homepage:latest
端口号:3010 ——> 3010
存储卷:
【容器】/app/config ——>【主机】/mnt/docker/homepage/config
【容器】/app/public/images ——>【主机】/mnt/docker/homepage/images
【容器】/app/public/icons ——>【主机】/mnt/docker/homepage/icons
【容器】/var/run/docker.sock ——>【主机】/mnt/docker/homepage/docker.sock
环境变量:
PUID ——> 0
PGID ——> 0
PORT ——> 3010
TZ ——> Asia/Shanghai
重启设置:
除非停止

部署容器

三、配置

  • 使用 FinalShell 登陆 LXC容器
    homepage06.png
    homepage07.png
    homepage08.png
    homepage09.png四、修改需要配置的.yaml文件

  • 修改settings.yaml文件【页面布局配置】

---
# For configuration options and examples, please see:
# https://gethomepage.dev/latest/configs/settings

#providers:
  #openweathermap: openweathermapapikey
  #weatherapi: weatherapiapikey

language: zh-CN # 设置语言为中文

title: 文乐文化 # 自定义homepage标题

favicon: /icons/logo.png # 自定义homepage图标

useEqualHeights: true # 等高卡

headerStyle: clean # 顶栏样式:underlined(默认)|boxed(透明方块)|clean(无遮拦)|boxedWidgets(方块)

statusStyle: "dot" # 设置绿点

layout: # 分组排序规划
  分组1: # 组名称
    style: row # 横向排列
    columns: 3 # 每行排4个
    header: false # 隐藏组名称
    iconStyle: defaults # optional, defaults to gradient
  分组2:
    style: row
    columns: 2
    header: false
  分组3:
    style: row
    columns: 4
    header: false
  分组4:
    style: row
    columns: 4
    header: false
  站点分组1:
    style: row
    columns: 4
    header: false
  站点分组2:
    style: row
    columns: 4
    header: false
  站点分组3:
    style: row
    columns: 4
    header: false

background: # 背景图片设置
  image: https://images.unsplash.com/photo-1502790671504-542ad42d5189?auto=format&fit=crop&w=2560&q=80
  blur: sm # 模糊度|sm(小)|0(无模糊)|md(中等)|xl(大)
  saturate: 50 # 饱和度|可以选择值为 0|50|100
  brightness: 100 # 亮度|可以选择值为 0|50|100
  opacity: 80 # 不透明度|可以选择值为 0-100
  cardBlur: sm # 模糊度|sm(小)|md(中等)
  • 修改services.yaml文件【应用程序添加】

 ---
# For configuration options and examples, please see:
# https://gethomepage.dev/latest/configs/services

- 分组1: # 分类名称
    - Jellyfin: # 应用名称
        icon: jellyfin.png # 图片
        href: http://10.0.0.5:8096/ # 后台管理页面地址
        description: 电影 & 电视剧 # 描述
        ping: http://10.0.0.5:8096 # Ping域名延迟
        widget:
          type: jellyfin # 组件名称
          url: http://10.0.0.5:8096 # 登陆地址Url
          key: d8a1c5c5d5764d85b38f4aa3e5d611ae # 密钥
          enableBlocks: true # 禁用状态为 false
          enableNowPlaying: true # 开启状态为 true
          
    - Prowlarr: # 应用名称
        icon: prowlarr.png # 图片
        href: http://10.0.0.6:9696/ # 后台管理页面地址
        description: 索引器 # 描述
        ping: http://10.0.0.6 # Ping域名延迟
        widget:
          type: prowlarr # 组件名称
          url: http://10.0.0.6:9696 # 登陆地址Url
          key: a26b5c35f46f4f2d8d672ace40307f5f # 密钥密钥
          
    - Jackett: # 应用名称
        icon: jackett.png # 图片
        href: http://10.0.0.6:9117/ # 后台管理页面地址
        description: 索引器 # 描述
        ping: http://10.0.0.6 # Ping域名延迟
        widget:
          type: jackett # 组件名称
          url: http://10.0.0.6:9117 # 登陆地址Url
          password: 123123 # 密码

- 分组2: # 分类名称        
    - Transmission:
        icon: /icons/transmission.png
        href: http://10.0.0.6:9696/
        description: 下载器
        ping: http://10.0.0.6:9696
        widget:
          type: transmission # 组件名称
          url: http://10.0.0.6:9696 # 登陆地址Url
          username: liwenle # 登陆账号
          password: 123123 # 登陆密码
          rpcUrl: /transmission/ # 这个为可选项,rpcUrl: /transmission/ 这一段数值可以在 transmission 的 settings.json 中找到
        
    - qBittorrent:
        icon: qbittorrent.png
        href: http://10.0.0.6:8080/
        description: 下载器
        ping: http://10.0.0.6
        widget:
          type: qbittorrent # 组件名称
          url: http://10.0.0.6:8080 # 登陆地址Url
          username: liwenle # 登陆账号
          password: 123123 # 登陆密码
                          
- 分组3: # 分类名称
    - Proxmox: # 应用名称
        icon: proxmox.png # 图片
        href: http://10.0.0.3:8006/ # 后台管理页面地址
        description: 虚拟机 # 描述
        ping: http://10.0.0.3:8006 # Ping域名延迟
        widget:
          type: proxmox # 组件名称
          url: http://10.0.0.3:8006 # 登陆地址Url
          username: homepage@pam!homepage # 打开PVE并登陆 ——> 数据中心 ——> 权限 ——> 群组 ——> 创建 ——> 名称自定义|备注:homepage ——> 权限 ——> 添加 ——> 群组权限 ——> 路径:/|群组:(选择刚创建的群组)|角色:PVEAuditor|继承:勾上 ——> 权限 ——> 用户 ——> 添加 ——> 用户名:自定义|领域:Linux PAM standar aut|群组:(选择刚创建的群组) |备注:homepage ——> API令牌 ——> 添加 ——> 用户名:(选择刚创建的用户名)|令牌ID:自定义|备注:homepage ——> 生成令牌ID|密钥 ——> 令牌ID=username|密钥=password
          password: 12328d47-9ba0-4c12-bfc6-c12c9123d8fe # 以上操作完成后 ——> 权限 ——> 添加 ——> API令牌权限 ——> 路径:/|API令牌:(选择刚创建的API令牌)|角色:PVEAuditor|继承:勾上 ——> 添加 ——> 完成
          node: pve # 节点名称
          
    - SA6400:
        icon: /icons/DSM.png
        href: http://10.0.0.5:5000/
        description: 群晖网络存储器
        ping: http://10.0.0.5:5000
        widget:
          type: diskstation
          url: http://10.0.0.5:5000
          username: remote_stats
          password: y@?@1BB*
          volume: volume_1 # optional
          
    - Synology Photos:
        icon: /icons/SynologyPhotos.png
        href: http://10.0.0.5:5000/?launchApp=SYNO.Foto.AppInstance&SynoToken=E3Kh0tnDSyLTc#/personal_space/timeline/
        description: 群晖相册
        ping: http://10.0.0.5:5000  

    #- TrueNAS:
        #icon: truenas.png
        #href: http://10.0.0.6/
        #description: TrueNAS网络存储器
        #ping: http://10.0.0.6
        #widget:
          #type: truenas # 名称
          #url: http://10.0.0.6 # 后台登陆地址
          #username: abcdefg # 登陆账号
          #password: abcdefg12345678 # 登陆密码
          #key: 1-F3Ssvq5HhPKMIgDIkOp9DSfq06vXJFJgHfV2jBs3H64r6AlIIayRvFxOI32t9VpU # 密钥
          #enablePools: true # 存储池 启用【true】 关闭【false】
          #nasType: scale # TrueNAS 的版本:scale、core
        
    - AdguardHome:
        icon: /icons/AdGuardhome.png
        href: http://10.0.0.6/
        description: 广告拦截 & DNS服务器
        ping: http://10.0.0.6
        widget:
          type: adguard # 名称
          url: http://10.0.0.6 # 后台登陆地址
          username: abcdefg # 登陆账号
          password: abcdefg12345678 # 登陆密码
        
    - Openwrt:
        icon: openwrt.png
        href: http://10.0.0.6/
        description: 旁路由器
        ping: http://10.0.0.6
        widget:
          type: openwrt
          url: http://10.0.0.2
          username: homepage
          password: abcdefg1234567
          interfaceName: eth0 # optional
          
    #- Download Station:     
        #widget:
          #type: downloadstation
          #url: http://10.0.0.6/
          #username: remote_stats
          #password: y@?@1AN*
          #volume: volume_1 # optional     
        
    - Homeassistant:
        icon: /icons/homeassistant.png
        href: http://10.0.0.6:8123/
        description: 智能家居管理
        ping: http://10.0.0.6
        #widget:
          #type: homeassistant
          #url: http://10.0.0.6:8123
          #key: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJjNjkzYmM4ODYxZTQ0ZDMwOWM3YjRmODBhM2M4NTZkNSIsImlhdCI6MTcxMjcxOTc2OSwiZXhwIjoyMDI4MDc5NzY5fQ.vSAdxffnuc3R5kXJVF9vYmjMWtJeoXvJmEkai3oEcGs
          #custom: # 指定自定义的状态或模板,用于显示在小部件中
            #- state: sensor.total_power # 显示总功率传感器的状态
            #- state: sensor.total_energy_today # 显示今日总能量传感器的状态
              #label: energy today # 显示的是今日能量数据
            #- template: "{{ states.switch|selectattr('state','equalto','on')|list|length }}" # 用于计算开启的开关的数量,这个模板的结果将作为一个自定义状态显示
              #label: switches on # 开启的开关的数量
            #- state: weather.forecast_home # 显示的是家庭天气预报的数据。
              #label: wind speed # 显示的是风速数据
              #value: "{attributes.wind_speed} {attributes.wind_speed_unit}" # 这个值指定了风速数据的格式
        
    - Navidrome:
        icon: /icons/navidrome.png
        href: http://10.0.0.6:8123/
        description: 音乐库
        ping: http://10.0.0.6
        #widget:
          #type: navidrome
          #url: http://10.0.0.6:8123/
          #user: abcdefg
          #token: abcdefg1234567 #md5(password + salt)
          #salt: randomsalt
​
- Docker: # 组名称
    - Portainer: # 应用名称
        icon: portainer.png # 图片
        href: http://10.0.0.6:8123/ # 后台管理页面地址
        description: 直连版 # 描述
        ping: http://10.0.0.6 # Ping域名延迟
        widget:
          type: portainer
          url: http://10.0.0.6:8123
          env: 2 # 查看这里填写多少,登录到 Portainer 中,点环境,点击您想要连接的目标环境,在浏览器的地址栏中,能够看到类似 #!/endpoints/1 这样的 URL,其中的数字就是您需要填写到 "env" 参数中的值。
          key: ptr_FYEDz9qdugT/AY/C/8zOEDXbN9TlzAHImb/CaX4Nx24=
          
    #- HomePage:
        #icon: /icons/xuancai5.png
        #href: http://10.0.0.8:3010/
        #description: 文乐文化
        #ping: http://10.0.0.8:3010
        
    - Nginx Proxy Manager:
        icon: /icons/nginx.png
        href: http://10.0.0.6:8123/
        description: 反向代理
        ping: http://10.0.0.6
        widget:
          type: npm
          url: http://10.0.0.6:8123/
          username: abcdefg123@gmail.com
          password: abcdefg1234567
        
    - NextCloud:
        icon: nextcloud.png
        href: http://10.0.0.6:8123/
        description: 私人网盘
        ping: http://10.0.0.6
        widget:
          type: nextcloud
          url: http://10.0.0.6:8123
          username: abcdefg
          password: abcdefg1234567
  • 修改bookmarks.yaml文件【网页书签添加】

---
# For configuration options and examples, please see:
# https://gethomepage.dev/latest/configs/bookmarks

- 站点分组1: # 分类名称
    - 阿童木: # 网站名称
        - icon: https://hdatmos.club/favicon.ico # 图标
          href: https://hdatmos.club/ # 网址
    - 电影天堂:
        - icon: /icons/电影天堂.jpg
          href: https://www.dy2018.com/
    - 字幕库:
        - icon: /icons/zimuku.png
          href: https://srtku.com/
    - 音范丝:
        - icon: https://www.yinfans.me/favicon.ico
          href: https://www.yinfans.me/
    - 悠悠mp4:
        - icon: https://www.uump4.cc/favicon.ico
          href: https://www.uump4.cc/
    - 磁力熊:
        - icon: https://www.cilixiong.com/favicon.ico
          href: https://www.cilixiong.com/
    - 不太灵影视:
        - icon: /icons/不太灵.png
          href: https://www.2bt0.com/
    - 新剧坊(百度网盘下载):
        - icon: https://www.xinjuc.com/favicon.ico
          href: https://www.xinjuc.com/
    - 海盗湾:
        - icon: https://thepiratebay.org/favicon.ico
          href: https://thepiratebay.org/
    - 13377:
        - icon: https://1337x.to/favicon.ico
          href: https://1337x.to/
    - 无损音乐下载站:
        - icon: https://www.xmwav.com/favicon.ico
          href: https://www.xmwav.com/
    - 趣站:
        - icon: https://www.ahhhhfs.com/favicon.ico
          href: https://www.ahhhhfs.com/
    - YTS:
        - icon: /icons/yts.png
          href: https://yts.mx/
    - IGG-Games:
        - icon: https://igg-games.com/favicon.ico
          href: https://igg-games.com/
    - Nyaa:
        - icon: /icons/nyaa.png
          href: https://nyaa.si/
    - Mikanani:
        - icon: https://mikanani.me/favicon.ico
          href: https://mikanani.me/
    - ACG:
        - icon: https://acg.rip/favicon.ico
          href: https://acg.rip/
    - comicat:
        - icon: https://www.comicat.org/favicon.ico
          href: https://www.comicat.org/
    - Miobt:
        - icon: https://miobt.com/favicon.ico
          href: https://miobt.com/
    - 简单动漫:
        - icon: https://www.36dm.org/favicon.ico
          href: https://www.36dm.org/
    - 蓝光演唱会:
        - icon: https://www.lgych.com/favicon.ico
          href: https://www.lgych.com/
    - 影视TV(在线观看):
        - icon: https://www.yingshi.tv/favicon.ico
          href: https://www.yingshi.tv/
    - 新视界(在线观看):
        - icon: https://www.histar.tv/favicon.ico
          href: https://www.histar.tv/
    - 游子视频(在线观看):
        - icon: https://youzisp.tv/favicon.ico
          href: https://youzisp.tv/
    - 全网搜索机器人(在线观看):
        - icon: https://v.ikanbot.com/favicon.ico
          href: https://v.ikanbot.com/
    - 秒搜(网盘搜索):
        - icon: https://miaosou.fun/favicon.ico
          href: https://miaosou.fun/


- 站点分组2: # 分类名称/icons/logo.png
    - Google: # 网站名称
        - icon: https://www.google.com/favicon.ico # 图标
          href: https://www.google.com/ # 网址
    - 矢量图标库:
        - icon: https://www.iconfont.cn/favicon.ico
          href: https://www.iconfont.cn/
    - ChatGPT:
        - icon: https://chat.openai.com/favicon.ico
          href: https://chat.openai.com/
    - Youtube:
        - icon: https://www.youtube.com/favicon.ico
          href: https://www.youtube.com/
    - 豆瓣电影:
        - icon: https://movie.douban.com/favicon.ico
          href: https://movie.douban.com/
    - TMDB:
        - icon: https://www.themoviedb.org/favicon.ico
          href: https://www.themoviedb.org/
    - HomePage:
        - icon: /icons/homepage.png
          href: https://gethomepage.dev/

- 站点分组3: # 分类名称
    - Cloudflare: # 网站名称
        - icon: https://www.cloudflare-cn.com/favicon.ico # 图标
          href: https://www.cloudflare-cn.com/ # 网址
    - Github:
        - icon: https://github.com/favicon.ico
          href: https://github.com/
    - Name-Silo域名购买:
        - icon: https://www.namesilo.com/favicon.ico
          href: https://www.namesilo.com/
    - Crx搜搜:
        - icon: https://www.crxsoso.com/favicon.ico
          href: https://www.crxsoso.com/
    - GreasyFork:
        - icon: /icons/greasyfork.png
          href: https://greasyfork.org/
    - SleazyFork:
        - icon: /icons/sleazyfork.png
          href: https://sleazyfork.org/
    - 解密API商店:
        - icon: https://decrypt.day/favicon.ico
          href: https://decrypt.day/
    - 博客有声书:
        - icon: https://getpodcast.xyz/favicon.ico
          href: https://getpodcast.xyz/
    - RSS订阅源:
        - icon: https://rss-source.com/favicon.ico
          href: https://rss-source.com/
    - 俄罗斯破解游戏:
        - icon: /icons/byrutor.png
          href: https://thebyrut.org/
    - 剪映字幕转换:
        - icon: https://crossub.xiaowude.com/favicon.ico
          href: https://crossub.xiaowude.com/
    - GXNAS 黑群晖:
        - icon: https://d.gxnas.com/favicon.ico
          href: https://d.gxnas.com/GXNAS%E7%BD%91%E7%9B%98-OneDrive/%E9%BB%91%E7%BE%A4%E6%99%96/

  • 修改widgets.yaml文件【配置顶栏插件】

---

- logo:
    icon: /icons/logo.png # optional

- resources: # 硬件信息
    cpu: true # CPU信息
    memory: true # 内存信息
    disk: /
    cputemp: true # CPU温度
    uptime: true # 系统的运行时间信息
    expanded: true # 显示扩展视图

- search:
    provider: google # google, duckduckgo, bing, baidu, brave or custom
    focus: true 
    showSearchSuggestions: true 
    target: _blank # One of _self, _blank, _parent or _top
    
- openmeteo: # 天气小组件
    label: 武昌 # 位置
    latitude: 30.3961 # 经度
    longitude: 114.8865 # 纬度
    timezone: Asia/Shanghai # 时区
    units: metric # 使用公制单位(例如米、千克、摄氏度等)
    cache: 5 # 刷新时间(分钟)

- datetime: # 时间
    text_size: xl # 字体大小
    format: # 指定了日期时间的格式设置
      dateStyle: short
      
- datetime:
    text_size: xl
    format:
      timeStyle: medium

五、详细配置官网

HomePage官网 组件配置


评论