Emby：首页轮播图 __2023年7月16日 __3条评论 __286次阅读 __0人点赞 __Tao_Qi
2023/8/21更新：
因为docker版本emby的/system/dashboard-ui没有持久化，所以更新镜像等会导致旧容器删除的操作都会使该文件夹变为初始状态，如需轮播图请重新来一遍或编辑emby的数据卷以持久化
2023/10/31更新：
写了一个脚本自动修改index.html
介绍 在Emby的大屏web端首页展示影视的介绍、背景图及logo 由Misty 免费影视服 预览 
不要太好看嗷🥰 使用方法 以docker部署的emby为例，其他方法可以去GitHub看看 可以用作者提供的一键脚本（好像有点问题）
[code]
# Docker 版 (如遇脚本更新, 重新执行即可)
# 注意: 需要能访问的上Github的环境, 如果不懂 请在群内@作者留言
# EmbyServer 为容器名, 如果你的容器名不是这个 请改成正确的!
docker exec EmbyServer /bin/sh -c 'cd /system/dashboard-ui && wget -O - https://tinyurl.com/2p97xcpd | sh'
[/code]
手动修改方法如下 下载所需文件 需要能访问github：点击下载，将上面的链接复制即可下载 需要5个文件，分别是：
[code]
main.js 位于\content
common-utils.js 位于\static\js
jquery-3.6.0.min.js 位于\static\js
md5.min.js 位于\static\js
style.css 位于\static\css
[/code]
可选步骤：修改文件 我的emby有很多个媒体库，新剧集入库后别的使用者就很难发现到，可以修改main.js文件让排序改为DateCreated 默认配置如下，节选自main.js第七行：
[code]
this.itemQuery = { ImageTypes: "Backdrop", EnableImageTypes: "Logo,Backdrop", IncludeItemTypes: "Movie,Series", SortBy: "ProductionYear, PremiereDate, SortName", Recursive: true, ImageTypeLimit: 1, Limit: 10, Fields: "ProductionYear", SortOrder: "Descending", EnableUserData: false, EnableTotalRecordCount: false };
[/code]
默认排序为ProductionYear, PremiereDate, SortName， 改成DateCreated，让最新入库的媒体放在最前面，非常醒目。 也可以修改轮播图数量上限，默认10张。 因为我的媒体库名称写在了封面上，所以不需要媒体库标题显示，修改style.css第37行：
[code]
display: flex; /* 如果不需要媒体库标题显示, 请将flex改为none */
[/code]
上传文件至容器内 需要将上述文件放置在容器/system/dashboard-ui文件夹内 先将所需文件放到宿主机的某个文件夹内，再使用下列命令传输至容器内
[code]
docker cp /root/playground/test/. emby:/system/dashboard-ui
[/code]
该命令将主机上 /root/playground/test/ 目录中的内容复制到名为 emby 的容器内部的 /system/dashboard-ui 目录中。 根据你的情况自行修改。 修改index.html文件 进入emby容器（将emby修改为你的emby容器名称，或者使用容器id）
[code]
docker exec -it emby sh
[/code]
该文件位于/system/dashboard-ui
[code]
cd system/dashboard-ui
# 修改index.html文件，vi编辑、保存、退出操作与vim一致
vi index.html
[/code]
翻到最下面，在前插入
[code]
[/code]
修改后保存好退出
[code]
# 退出容器
exit
[/code]
实时生效，刷新下网页即可，可在pc、平板网页端显现，手机、pc客户端暂无，等作者更新吧🥰 持久化 更新容器会导致上传文件丢失，有点不方便，可以将文件放在宿主机内映射到emby容器中进行持久化，但依然需要修改index.html文件 需修改创建emby的命令：
[code]
docker run \
--network=bridge \
-p '8096:8096' \
-p '8920:8920' \
-p '1900:1900/udp' \
-p '7359:7359/udp' \
-v /mnt/emby/config:/config \
-v /mnt/share:/data \
-v /mnt/emby/crx:/system/dashboard-ui/crx \ # 添加这一行即可，自行修改文件夹
-e TZ="Asia/Shanghai" \
--device /dev/dri:/dev/dri \
-e UID=0 \
-e GID=0 \
-e GIDLIST=0 \
--restart always \
--name emby \
-d lovechen/embyserver:latest
[/code]
我将上面的5个文件都放在了宿主机的/mnt/emby/crx文件夹中，映射至/system/dashboard-ui/crx内；
[code]
# 将文件放至宿主机内
root@Docker:/mnt/emby/crx# ls
common-utils.js jquery-3.6.0.min.js main.js md5.min.js style.css
# emby容器中应该可以看到这些文件
/system/dashboard-ui/crx # ls
common-utils.js jquery-3.6.0.min.js main.js md5.min.js style.css
[/code]
此时修改index.html文件即可，在前插入：
[code]
[/code]
自动化 因为我的emby使用了watchtower自动更新，一更新就失效，属实有点不方便，参考作者的脚本及ChatGPT的帮助写了一个脚本每天定时运行保证轮播图实时有效。 承接上一节的持久化，已将宿主机crx目录映射至/system/dashboard-ui/crx（示例），并下载、修改好所需文件，再在该目录下新建以下脚本：
[code]
#!/bin/sh
# 定义文件路径
html_file="/system/dashboard-ui/index.html"
insert_code="
"
# 判断文件是否存在
if [ -e "$html_file" ]; then
# 检查是否已引入main.js
if grep -q "main.js" "$html_file"; then
echo "已成功引入，无需重复操作."
else
# 插入代码到 之前
awk -v code="$insert_code" '// {print code; print; next} 1' "$html_file" > "$html_file.tmp" && mv "$html_file.tmp" "$html_file"
echo "已成功插入样式表和脚本到 $html_file."
fi
else
echo "$html_file 不存在,请根据自身情况修改脚本"
fi
[/code]
保存为script.sh，chmod x script.sh赋予执行权限 运行docker exec emby /system/dashboard-ui/crx/script.sh 跑两遍看看有没有出错，没有的话接下来使用crontab定时任务
[code]
# 打开cron表编辑器：
crontab -e
# 在文件末尾添加以下行，表示每天执行一次脚本：
0 0 * * * docker exec -it emby /system/dashboard-ui/crx/script.sh > /dev/null 2>&1
[/code]
这个例子中，0 0 * 表示在每天的午夜（00:00）执行脚本，并将输出（包括标准输出和标准错误）都丢弃。你可以根据需要调整这个时间，比如说定到watchtower自动更新时间后半个小时，最后保存并关闭文件。 注意 电影、剧集需要有背景图才会展示在首页轮播图上，修改轮播图也是修改电影、剧集的背景图 我的博客 MJ的博客
这篇文章：Emby：首页轮播图
朽仟说道： 2023年7月16日 下午5:58
另外,楼主的博客蛮清新有趣,看似二次元但很沉浸式的元素化 回复
发表回复 取消回复电子邮件地址不会被公开。必填项已用 标注 __ __