Baneq：创建页面，内容为“{{DISPLAYTITLE:视频与图片集维护说明}} NOTOC 本页用于记录「视频 Videos」与「图片集 Portfolio」页面的维护方法，方便后续编辑者添加视频、补充封面、上传图片和扩展图片集内容。 == 视频页面维护 == 视频页面主要使用模板 '''{{视频}}''' 展示外链视频。普通编辑者只需要在页面中添加模板，不需要手动写 HTML 或 CSS。 === 添加一个新视频…”

2026-06-16T05:39:10Z

创建页面，内容为“{{DISPLAYTITLE:视频与图片集维护说明}} __NOTOC__ 本页用于记录「视频 Videos」与「图片集 Portfolio」页面的维护方法，方便后续编辑者添加视频、补充封面、上传图片和扩展图片集内容。 == 视频页面维护 == 视频页面主要使用模板 '''<nowiki>{{视频}}</nowiki>''' 展示外链视频。普通编辑者只需要在页面中添加模板，不需要手动写 HTML 或 CSS。 === 添加一个新视频…”

新页面

{{DISPLAYTITLE:视频与图片集维护说明}}
__NOTOC__

本页用于记录「视频 Videos」与「图片集 Portfolio」页面的维护方法，方便后续编辑者添加视频、补充封面、上传图片和扩展图片集内容。

== 视频页面维护 ==

视频页面主要使用模板 '''<nowiki>{{视频}}</nowiki>''' 展示外链视频。普通编辑者只需要在页面中添加模板，不需要手动写 HTML 或 CSS。

=== 添加一个新视频 ===

在「视频 Videos」页面中添加以下格式：

<pre>
{{视频
|标题=视频标题
|链接=https://www.bilibili.com/video/BVxxxxxxxxxx
|平台=BiliBili
}}
</pre>

如果已经有封面文件，也可以手动指定封面：

<pre>
{{视频
|标题=视频标题
|链接=https://www.bilibili.com/video/BVxxxxxxxxxx
|平台=BiliBili
|封面=Bilibili封面-BVxxxxxxxxxx.jpg
}}
</pre>

字段说明：

* '''标题'''：视频卡片中显示的视频名称。
* '''链接'''：视频地址，目前主要支持 Bilibili 视频链接。
* '''平台'''：视频平台名称，例如 BiliBili。
* '''封面'''：可选字段。填写后，视频卡片左侧会显示该图片作为缩略图。

=== 自动补充 Bilibili 封面 ===

服务器上有一个脚本可以自动扫描视频页面中的 Bilibili 链接，抓取视频封面，上传到 Wiki，并把封面字段补回模板中。

脚本位置：

<pre>
/opt/wiki/tools/bilibili_cover_bot.py
</pre>

手动运行方式：

<pre>
python3 /opt/wiki/tools/bilibili_cover_bot.py \
--api https://wiki.noblecraftmusic.cloud/api.php \
--user 你的Wiki用户名 \
--title "视频 Videos"
</pre>

建议正式执行前先 dry-run 检查：

<pre>
python3 /opt/wiki/tools/bilibili_cover_bot.py \
--api https://wiki.noblecraftmusic.cloud/api.php \
--user 你的Wiki用户名 \
--title "视频 Videos" \
--dry-run
</pre>

如果 dry-run 显示会修改页面，再去掉 <code>--dry-run</code> 正式执行。

注意事项：

* 脚本只会处理使用 <nowiki>{{视频}}</nowiki> 模板的视频。
* 链接中需要包含 Bilibili 的 BV 号。
* 已经有 <code>封面=</code> 的视频通常不会重复处理。
* 如果封面没有显示，先检查文件名是否完整、模板中是否已经补上 <code>封面=文件名.jpg</code>。

== 图片集页面维护 ==

「图片集 Portfolio」页面使用自定义卡片排版。添加图片时，不再直接使用普通的 <nowiki>[[File:...|thumb]]</nowiki> 排列，而是把图片放进对应的卡片结构中。

添加图片前，请先把图片上传到 Wiki，并记住上传后的文件名。

=== 添加官方设定图 ===

官方设定图放在「官方设定图」下的对应区域，例如「服务器娘」。

在对应的 <code>nc-character-grid</code> 区块中，添加一个卡片：

<pre>
<div class="nc-art-card">
<div class="nc-art-image">[[File:文件名.jpg|link=File:文件名.jpg]]</div>
<div class="nc-art-caption">'''作品标题'''<br><span>画师：作者名</span></div>
</div>
</pre>

示例：

<pre>
<div class="nc-art-card">
<div class="nc-art-image">[[File:诺布-新服装.jpg|link=File:诺布-新服装.jpg]]</div>
<div class="nc-art-caption">'''诺布 - 新服装'''<br><span>画师：作者名</span></div>
</div>
</pre>

=== 添加 LOGO 或品牌素材 ===

LOGO 区使用 <code>nc-logo-card</code>。在 LOGO 区添加：

<pre>
<div class="nc-logo-card">
<div class="nc-logo-image">[[File:文件名.png|frameless|320x180px|link=File:文件名.png]]</div>
<div class="nc-art-caption">'''作品标题'''<br><span>设计：作者名</span></div>
</div>
</pre>

如果是夜间版、黑底版 LOGO，可以在图片区额外加 <code>nc-logo-dark</code>：

<pre>
<div class="nc-logo-card">
<div class="nc-logo-image nc-logo-dark">[[File:文件名.png|frameless|320x180px|link=File:文件名.png]]</div>
<div class="nc-art-caption">'''作品标题'''<br><span>设计：作者名</span></div>
</div>
</pre>

=== 添加玩家创作 ===

玩家创作放在「玩家创作」区域的 <code>nc-fanart-grid</code> 中。

<pre>
<div class="nc-art-card">
<div class="nc-art-image">[[File:文件名.jpg|link=File:文件名.jpg]]</div>
<div class="nc-art-caption">'''作品标题'''<br><span>创作者：作者名</span></div>
</div>
</pre>

示例：

<pre>
<div class="nc-art-card">
<div class="nc-art-image">[[File:诺布娘 - 玩家名.jpg|link=File:诺布娘 - 玩家名.jpg]]</div>
<div class="nc-art-caption">'''诺布娘'''<br><span>创作者：玩家名</span></div>
</div>
</pre>

=== 添加隐藏展区图片 ===

隐藏展区目前建议继续使用折叠模板，不建议在折叠模板里塞复杂卡片代码。

推荐格式：

<pre>
{{折叠|标题=这是？|[[File:文件名.jpg|center|thumb|420x420px|'''作品标题'''<br>创作者：作者名]]}}
</pre>

== 样式修改说明 ==

视频卡片和图片集卡片的样式写在：

<pre>
MediaWiki:Common.css
</pre>

一般编辑内容时，不需要修改 CSS。只有在需要调整卡片尺寸、阴影、颜色、间距时，才修改 Common.css。

重要原则：

* 页面内容放在「视频 Videos」或「图片集 Portfolio」页面中。
* 视觉样式放在 <code>MediaWiki:Common.css</code> 中。
* 不要用新的 CSS 覆盖整份 Common.css，除非已经确认备份。
* 添加补丁类 CSS 时，通常放在 Common.css 的最底部，方便覆盖旧样式。

== 常见问题 ==

=== 视频没有封面 ===

可能原因：

* 模板中还没有 <code>封面=</code> 字段。
* 自动脚本还没有运行。
* Bilibili 链接格式不规范，脚本没有识别到 BV 号。
* 封面文件名中有特殊字符，导致图片没有被正确引用。

建议先检查页面源码中对应视频模板是否已经出现 <code>封面=...</code>。

=== 图片集新图片没有变成卡片 ===

通常是因为图片没有放进正确的卡片结构中。请确认图片被包在：

<pre>
<div class="nc-art-card">
...
</div>
</pre>

或：

<pre>
<div class="nc-logo-card">
...
</div>
</pre>

里面。

=== 图片比例不一样会不会影响页面 ===

不会。图片集卡片会自动把图片限制在展示区域内。不同尺寸、不同长宽比的图片都可以添加，但建议上传清晰版本，并尽量避免过小的图片。

=== 白底图片看起来突兀怎么办 ===

目前图片集样式已经尽量使用接近白色的展示底，减少白底图片的突兀感。如果仍然明显，可以优先考虑上传带透明背景的 PNG，或保留原图但接受其作为作品本身的一部分展示。

[[Category:帮助页面]]

Help:视频与图片集维护说明 - 版本历史