前言

欢迎来到组件中心页！这是一个收录有 component: 分类下所有页面的中心页。根据 05 指挥部技术中心标签列表中所述，组件被定义为“使用 [[include]] 来引入至其它页面的组件页，以添加新的设计、风格、或功能。”这并不包括版式（版式修改了页面的外观以及风格），或者是更多由页面（即用于列出某些作者作品的页面）。

内容列表

本页分为以下几个类别：

组件

通用

该组件可用作 SCP 文章的版头。它能展示出 SCP 的项目编号、收容等级、扰动等级以及风险等级。这些变量的定义可以在这篇指导里找到。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki-cn:component:anomaly-class-bar-source
|lang= cn/tr
|item-number= XXXX
|clearance= #
|container-class= 这里填等级
|secondary-class= 这里填等级
|secondary-icon= http://这里填链接.com
|disruption-class= 这里填等级
|risk-class= 这里填等级
]]

你可以通过这个由 Woedenaz 制作的花哨数据库查看所有使用了 ACS 的页面。

该组件将在页面被加载时播放 ACS 版头的加载动画。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki:component:acs-animation]]

你可以在 SCP-5935 中查看这一组件的运作效果。

一个没那么多细节的 ACS 版本。若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki-cn:component:acs-hybrid-text-bar-source
|lang= cn/tr
|version= hybrid/text
|item-number= ####
|clearance-level= #
|containment-class= 这里填等级
|include-secondary= yes/no
|secondary-class= 这里填等级
|secondary-icon= https://这里填链接.com
|disruption-class= 这里填等级
|risk-class= 这里填等级
]]

一个将线条粗细统一为 3px 且在大多数设备上将版头的大小减半的 ACS 组件。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki-cn:component:acs-horm-lite-source
|lang= cn/tr
|item-number= XXXX
|clearance= #
|container-class= 这里填等级
|secondary-class= 这里填等级
|secondary-icon= http://这里填链接.com
|disruption-class= 这里填等级
|risk-class= 这里填等级
]]

该组件在大多数设备上缩小了 ACS，并让它有了一种稍微不同的感觉。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki-cn:component:acs-peppo-lite
|lang= cn/tr
|item-number= ####
|clearance= #
|container-class= 这里填等级
|secondary-class= 这里填等级
|secondary-icon= http://这里填链接.com
|disruption-class= 这里填等级
|risk-class= 这里填等级
]]

该组件允许同时显示收容等级与次要等级。若需使用，将以下代码黏贴到你页面中 ACS 的 [[include]] 后方：

[[include :scp-wiki-cn:component:acs-peppo-split
|object= 这里填等级
|object-image= http://这里填链接.com
|object-color= 这里填等级
|esoteric-color= 这里填等级
]]

基础的 ACS 引用应该要设定为显示次要分级，而 object、object-image 以及 object-color 则设定为你想要的收容等级。

该组件可用作 SCP 文章的版头，与其它常用的版头合成了独立的一个。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki-cn:component:advanced-information-methodology
|lang=cn/tr
|XXXX=####
|lv=one/two/three/four/five/fix/1/2/3/4/5/6
|cc=SAFE/EUCLID/KETER/NEUTRALIZED/THAUMIEL
|dc=DARK/VLAM/KENEQ/EKHI/AMIDA
|site=Site-编号/ N/A
|dir=Dr 主管/ N/A
|head=Dr 博士/ N/A
|mtf=名称-编号/ N/A
]]

该组件提供了一个完全可定制的音频播放器。若需使用，可将以下代码黏贴到你页面中的任何地方：

[[include :scp-wiki-cn:component:audio-player-woed-source
|unique-name=secretparty（仅字母，不能是数字）
|audio-file= https://这是一个链接.com/PartyTime.mp3（所有音频文件格式都支持）
|background-color=rgb(252, 252, 252)
|border-color=rgb(215, 215, 215)
|border-radius=0.313rem
|dropshadow-color=rgba(12, 12, 12, 0.15)
|text-color=rgb(80, 0, 2)
|icons-color=rgb(171, 0, 5)
|player-color=rgb(215, 215, 215)
|progress-color=rgb(80, 0, 2)
]]

该组件提供了一种在页面顶部通过一个小的下拉菜单来标示作者的手段。若需使用，可将以下代码黏贴到你的评分模组后方：

[[include :scp-wiki-cn:component:author-label-source start=--
|name=名字]]
内容[[include :scp-wiki-cn:component:author-label-source end=--]]

该组件提供了一个快速且简单的方式来建立自己的作者页，且不需要在每次发布新页面之时更新你的作者页。若需使用，可将以下代码黏贴到你的页面中：

[[include :scp-wiki-cn:component:author-page order=created_at]]

该组件提供了如 SCP-4485 中所示的自定义脚注。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki:component:betterfootnotes]]

随后，每当你需要使用脚注的时候，都将以下代码黏贴到那个地方：

[[span class="fnnum"]].[[/span]][[span class="fncon"]]脚注中的文本。[[/span]]

注意不要编辑 fnnum span 里的任何东西，不然组件可能会崩溃。.若正确操作，那么它应该会变成这个样子！

该组件修改了目前存在的 [[collapsible]] 元素并给予其一个新的外观。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki-cn:component:bhl-style-collapse-source]]

你可以在 Flos 里看到这个组件的效果。

该组件提供了一个花哨的黑标风格 div 来装饰你的页面。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki:component:blacklight-box-source |inc-source= --]]]

在那之后，每次你需要用一个盒子的时候，就将这个黏贴到你想要放的地方：

[[include :scp-wiki:component:blacklight-box-source |inc-section-start= --]
|color-family=可选颜色
|unique-name=小写无空格
|display-name=标签内的文本
]]
在此插入盒中内容。[[include :scp-wiki:component:blacklight-box-source |inc-section-end= --]]]

“color-family” 参数是可选的且可在你的盒子上用任何的自定义颜色。

你可以在 McDoctorate 的提案中看到这个组件的效果。

[[div class="cn cdver2" style="width: 100%;height: 0;padding-bottom: calc(50% / 3);background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22600%22%20height%3D%22100%22%20viewBox%3D%220%200%20600%20100%22%3E%3Cdefs%3E%3Cstyle%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3Erect%5Bfill*%3D%22b01%22%5D%20%7Banimation%3A%20blink%203s%20ease-in-out%20infinite%3B%7D%40keyframes%20blink%20%7B0%25%2C20%25%7Bfill-opacity%3A%201%3B%7D50%25%7Bfill-opacity%3A%200.75%3B%7D80%25%2C100%25%20%7Bfill-opacity%3A%201%3B%7D%7D%3C%2Fstyle%3E%3Cfilter%20id%3D%22shadow%22%20width%3D%22200%25%22%20height%3D%22200%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%223%22%20result%3D%22shadow%22%2F%3E%3CfeOffset%20dx%3D%220%22%20dy%3D%220%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%3E%3Ctext%20x%3D%2210%22%20y%3D%2240%22%20font-size%3D%2216%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E9%A1%B9%E7%9B%AE%E7%BC%96%E5%8F%B7%EF%BC%9A%3C%2Ftspan%3ESCP-6776%3C%2Ftext%3E%3Ctext%20x%3D%2210%22%20y%3D%2270%22%20font-size%3D%2216%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E9%A1%B9%E7%9B%AE%E7%AD%89%E7%BA%A7%EF%BC%9A%3C%2Ftspan%3EThaumiel%3C%2Ftext%3E%3C%2Fg%3E%3Cg%3E%3Crect%20x%3D%22220%22%20y%3D%2225%22%20width%3D%222%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22%23333%22%2F%3E%3Ctext%20x%3D%22230%22%20y%3D%2232%22%20font-size%3D%229%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E8%B4%9F%E8%B4%A3%E7%AB%99%E7%82%B9%EF%BC%9A%3C%2Ftspan%3EN/A%3C%2Ftext%3E%3Ctext%20x%3D%22230%22%20y%3D%2246%22%20font-size%3D%229%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E9%A1%B9%E7%9B%AE%E4%B8%BB%E7%AE%A1%EF%BC%9A%3C%2Ftspan%3EN/A%3C%2Ftext%3E%3Ctext%20x%3D%22230%22%20y%3D%2260%22%20font-size%3D%229%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E9%A6%96%E5%B8%AD%E7%A0%94%E7%A9%B6%E5%91%98%EF%BC%9A%3C%2Ftspan%3EAkabi%20Hayk%20%E5%8D%9A%E5%A3%AB%3C%2Ftext%3E%3Ctext%20x%3D%22230%22%20y%3D%2274%22%20font-size%3D%229%22%20font-family%3D%22Arial%2Csans-serif%22%3E%3Ctspan%20font-weight%3D%22bold%22%3E%E6%8C%87%E6%B4%BE%E7%89%B9%E9%81%A3%E9%98%9F%EF%BC%9A%3C%2Ftspan%3EN/A%3C%2Ftext%3E%3Crect%20x%3D%22488%22%20y%3D%2225%22%20width%3D%222%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22%23333%22%2F%3E%3C%2Fg%3E%3Cg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20transform%3D%22skewX(-15)%22%3E%3Crect%20x%3D%22523%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 | transparent ]]%22%2F%3E%3Crect%20x%3D%22535%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 ]][[#ifexpr 4 == 5 | %23b01 ]][[#ifexpr 4 < 5 | %23aaa ]]%22%2F%3E%3Crect%20x%3D%22547%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 ]][[#ifexpr 4 == 5 | %23333 ]][[#ifexpr 4 == 4 | %23b01 ]][[#ifexpr 4 < 4 | %23aaa ]]%22%2F%3E%3Crect%20x%3D%22559%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 ]][[#ifexpr 4 == 5 | %23333 ]][[#ifexpr 4 == 4 | %23333 ]][[#ifexpr 4 == 3 | %23b01 ]][[#ifexpr 4 < 3 | %23aaa ]]%22%2F%3E%3Crect%20x%3D%22571%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 ]][[#ifexpr 4 == 5 | %23333 ]][[#ifexpr 4 == 4 | %23333 ]][[#ifexpr 4 == 3 | %23333 ]][[#ifexpr 4 == 2 | %23b01 ]][[#ifexpr 4 < 2 | %23aaa ]]%22%2F%3E%3Crect%20x%3D%22583%22%20y%3D%2225%22%20width%3D%2210%22%20height%3D%2250%22%20rx%3D%222%22%20ry%3D%222%22%20fill%3D%22[[#ifexpr 4 == 6 | %23b01 ]][[#ifexpr 4 == 5 | %23333 ]][[#ifexpr 4 == 4 | %23333 ]][[#ifexpr 4 == 3 | %23333 ]][[#ifexpr 4 == 2 | %23333 ]][[#ifexpr 4 == 1 | %23b01 ]][[#ifexpr 4 < 1 | %23aaa ]]%22%2F%3E%3C%2Fg%3E%3Ctext%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%22535%22%20y%3D%2270%22%20font-size%3D%2216%22%20font-family%3D%22Arial%2Csans-serif%22%20font-weight%3D%22bold%22%20fill%3D%22[[#ifexpr 4 > 5 | %23aaa | %23fff ]]%22%20filter%3D%22url(%23shadow)%22%3ELv.%3Ctspan%20font-size%3D%2225%22%3E4%3C%2Ftspan%3E%3C%2Ftext%3E%3Ctext%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%22535%22%20y%3D%2270%22%20font-size%3D%2216%22%20font-family%3D%22Arial%2Csans-serif%22%20font-weight%3D%22bold%22%20fill%3D%22[[#ifexpr 4 > 5 | %23fff | %23000 ]]%22%3ELv.%3Ctspan%20font-size%3D%2225%22%3E4%3C%2Ftspan%3E%3C%2Ftext%3E%3C%2Fsvg%3E");"]]
[[/div]]

[[iftags]]

<html>
<head>
    <style>body {font-family: sans-serif; font-size: .8em;} .sample {width: 100%;height: 0;padding-bottom: calc(50% / 3);background-position: center; background-size: contain; background-repeat: no-repeat;} .opt {display: grid; grid-template-columns: 15em 1fr;} .opt > b {grid-column: 1 / 2;} .opt > input {font-size: 16px; grid-column: 2 / 2;} .opt > span {color: #888; grid-column: 2 / 2; margin: 0 0 1em;} textarea {font-family: sans-serif; height: 300px; width: 100%;}</style>
</head>
<body>

  <div class="sample"></div>

  <div class="opt">
    <b>许可等级：</b><input type="number" min="0" max="6" value="3" />
    <span>1, 2, 3, 4, 5, 6</span>
    <b>编号：</b><input type="text" value="SCP-XXXX" />
    <b>等级：</b><input type="text" value="Euclid" />
    <b>负责站点：</b><input type="text" value="Site-19" />
    <b>项目主管：</b><input type="text" value="研究员 John Doe" />
    <b>首席研究员：</b><input type="text" value="研究员 John Doe" />
    <b>指派特遣队：</b><input type="text" value="MTF Beta-7（“Maz Hatters”-疯帽商）" />
  </div>
  <textarea readonly></textarea>
<script>
var o = {};
var txt = document.querySelector('textarea');
var smp = document.querySelector('.sample');
var ipt = Array.from(document.querySelectorAll('input')).map(function(v, i) {

  ['onchange', 'oninput'].forEach(function(f) {
    v[f] = function(e) {
      txt.value = '[[include :scp-wiki-cn:component:cd-ver2\n' + ipt.map(function(v) {return '|' + v.name + '=' + encodeURI(v.input.value)}).join('\n') + '\n]]';
      smp.setAttribute('style', 'background-image: url("data:image/svg+xml;charset=utf8,' + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="600" height="100" viewBox="0 0 600 100"><defs><style>rect[fill*="b01"] {animation: blink 3s ease-in-out infinite;}@keyframes blink {0%,20%{fill-opacity: 1;}50%{fill-opacity: 0.75;}80%,100% {fill-opacity: 1;}}</style><filter id="shadow" width="200%" height="200%"><feGaussianBlur stdDeviation="3" result="shadow"/><feOffset dx="0" dy="0"/></filter></defs><g><text x="10" y="40" font-size="16" font-family="Arial,sans-serif"><tspan font-weight="bold">项目编号：</tspan> ' + o.item.value + '</text><text x="10" y="70" font-size="16" font-family="Arial,sans-serif"><tspan font-weight="bold">项目等级：</tspan> ' + o.class.value +  '</text></g><g><rect x="220" y="25" width="2" height="50" rx="2" ry="2" fill="#333"/><text x="230" y="32" font-size="9" font-family="Arial,sans-serif"><tspan font-weight="bold">负责站点：</tspan> ' + o['site-responsible'].value + '</text><text x="230" y="46" font-size="9" font-family="Arial,sans-serif"><tspan font-weight="bold">项目主管：</tspan> ' + o['director'].value + '</text><text x="230" y="60" font-size="9" font-family="Arial,sans-serif"><tspan font-weight="bold">首席研究员：</tspan> ' + o['research-head'].value + '</text><text x="230" y="74" font-size="9" font-family="Arial,sans-serif"><tspan font-weight="bold">指派特遣队：</tspan> ' + o['assigned-task-force'].value + '</text><rect x="488" y="25" width="2" height="50" rx="2" ry="2" fill="#333"/></g><g transform="skewX(-15)"><rect x="523" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 ? '#b01' : 'transparent') + '"/><rect x="535" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 5 ? '#b01' : '#aaa') + '"/><rect x="547" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 4 ? '#b01' : Number(o.lv.value) > 4 ? '#333' : '#aaa') + '"/><rect x="559" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 3 ? '#b01' : Number(o.lv.value) > 3 ? '#333' : '#aaa') + '"/><rect x="571" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 2 ? '#b01' : Number(o.lv.value) > 2 ? '#333' : '#aaa') + '"/><rect x="583" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 1 ? '#b01' : Number(o.lv.value) > 1 ? '#333' : '#aaa') + '"/></g><text x="535" y="70" font-size="16" font-family="Arial,sans-serif" font-weight="bold" fill="#fff" filter="url(#shadow)">Lv.<tspan font-size="25">' + o.lv.value + '</tspan></text><text x="535" y="70" font-size="16" font-family="Arial,sans-serif" font-weight="bold" fill="' + (Number(o.lv.value) == 6 ? '#fff' : '#000') + '">Lv.<tspan font-size="25">' + o.lv.value + '</tspan></text></svg>') + '");')
    }
  })

  var _ = {name: [
    'lv',
    'item',
    'class',
    'site-responsible',
    'director',
    'research-head',
    'assigned-task-force'
  ][i],
  input: v};
  o[_.name] = v;
  return _;

});

txt.onfocus = function(e) {
  e.target.select();
}
ipt[0].input.onchange();
</script>
</body>
</html>

[[/iftags]]

该组件可作为 SCP 文章的版头。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki-cn:component:cd-ver2
|lv=1/2/3/4/5/6
|item=SCP-XXXX
|class=等级
|site-responsible=Site/Area-##
|director=名字
|research-head=名字
|assigned-task-force= MTF 名称-## ("代号")
]]

你可以在 匿名的提案 II 中看到这个组件的效果。

4/6776 级 4/6776

机密

[[div_  class="class1image" data-level="lv4"]]

[[div_  class="item1 CN"]]

[[/div]]
[[/div]]

该组件可作为 SCP 文章的版头。若需使用，可将以下代码黏贴到你页面中的顶部：

[[include :scp-wiki-cn:component:classified-bar-woed
|lv=0/1/2/3/4/5
|item=XXXX
|oc=等级
|lang=CN/TR
]]

4/6776 级 4/6776 机密

项目编号：SCP-6776 项目等级: Thaumiel

该组件为你的 SCP 文章添加了一个版头。若需使用，可将以下代码黏贴到你页面中的顶部：

[[include :scp-wiki-cn:component:classified-decoration
|lv=1/2/3/4/5
|item=XXXX
|oc=等级
|lang=CN/TR
]]

该组件是 Croquembouche 的个人自定义组件，包含有小小的 CSS 组件。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki:component:croqstyle]]

该组件允许你在页面中模拟 Discord 聊天室的外观。若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki-cn:component:discord-chat-source |inc-source= --]]]

有关其使用的进一步说明，请参阅组件页本身。

该组件提供了一个简单的方法来引导读者阅读整个故事系列。若需使用，可将以下代码黏贴到你页面中的底部：

[[include :scp-wiki:component:earthworm
| first=true/false | last=true/false | hub=yes/no
| previous-url=上一文档的URL | previous-title=上一文档的标题
| next-url=上一文档的URL | next-title=下一文档的标题
| hub-url=中心页URL | hub-title=中心页标题
]]

该组件能够平滑的渐显出页面中的内容，而不是一次性将其全部加载出来。若需使用，可将以下代码黏贴到你页面中的某个地方：

[[include :scp-wiki:component:fade-in speed=1/2/3]]

你可以在 空白风格和占位风格版式中看到这个组件的效果。

该组件为你的 SCP 文章添加了一个版头。若需使用，可将以下代码黏贴到你页面中的顶部：

[[include :scp-wiki-cn:component:flops-header
|item= 0001–9999
|containment= safe/euclid/keter/thaumiel/其它
|level= 1–6
|security= 公开/受限/保密/机密/最高机密/其它
|disruption= dark/vlam/keneq/ekhi/amida/其它
|disruption-bg-color= #00638a/#008a5c/#bd9d00/#bd5200/#8a0022/自选
]]

[[/div]]
[[/div]]

该组件用于以视觉上有吸引力的方式链接任何网站之外的筹资网站。该组件的所有使用必须遵守 SCP 维基的资助守则。若需使用，可将以下代码黏贴到你的页面中：

[[include :scp-wiki-cn:component:fundraiser-widget amt=
|goal=
|title=
|main_url=
|curr_sym=$|num_sep=,
|image_url= none
|donate_url= none
|logo_text=
|description=
]]

海报：

[[collapsible show="查看页面" hide="收起页面]]
页面左侧：

以下是一份名为《关于马戏团的诞生：赫曼·富勒的巡回怪胎展》的出版物中的一页，其作者和出版商的身份未能确定。而这些散页，被发现夹杂在世界各地的图书馆中，以马戏团为主题的书籍里。尚不明确谁是这种散播行为背后的个体或群体。

页面右侧：

[[/collapsible]]

这些组件与 GoI 格式赫曼·富勒的不安马戏团有关。若需使用，可黏贴以下代码：

[[include :scp-wiki-cn:component:hf-poster title=[1]|textLeft=[2]|image=[3]|textRight=[4]|textBottom=[5]|textFooter=[6]]]

[[include :scp-wiki-cn:component:hf-book-left chapter=[1]|content=[2]|pagenumber=[3]]]

[[include :scp-wiki-cn:component:hf-book-right chapter=[1]|content=[2]|pagenumber=[3]]]

该组件允许你在页面中插入带说明文字的图片。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:image-block name=文件名/链接|caption=内容|width=###px]]

还有多种插图方块的变体，你可以在下方找到这些变体组件：

📎Peppo 的插图方块

该组件会自动将方块的右侧与齐平边缘对齐，而不是与评分模块对齐，且将在读者使用移动端时格式化图像。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:image-block-peppo
|name=文件链接
|caption=说明文字
|width=###px（推荐为 300px）
]]

📎引用块中的插图方块

该组件允许将图片充当为链接。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:image-block-quoted name=文件|caption=文本|link=链接|width=300px]]

📎SunnyParallax 的插图方块

该组件主要由 SunnyClockwork 使用。它可以自动将图片放入一个折叠中并将说明文本设置为它上方的标题，在同一页面中展示大量艺术作品时会非常有用。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:sp-image caption=说明文本|src=文件链接|width=###]]

📎宽屏图像裁剪器

使用组件后：

使用组件前：

该组件将宽屏图像缩放至高度为 215px 且宽度合适的大小。该组件允许你使用宽屏图像当作版头而不必精确地裁切图像。

若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki:component:wide-image-sizer]]

然后给图片黏贴以下代码：

[[include :scp-wiki-cn:component:image-block
     name=https://scp-wiki-cn.wikidot.com/local--files/（你图片链接的剩余部分） |
     caption=（这里是你的文字说明） |
     align=center |
     width=100%
]]

该组件允许你在一个插图方块之中轮播不同的图像。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:carousel
| images=photograph.png,old-map.png,jumpscare.gif
| caption=一组图片
| interval=5
| wiki=scp-wiki-cn
| page=SCP-173
| width=300px
| height=240px
| position=right
| no-caption=false
| background=white
| options=yes
]]

有关该组件中每个字段作用的更多信息可在其组件页中找到。

你可以在 SCP-5800 中查看这一组件的运作效果。

该组件允许你用各种各样的功能自定义插图方块。

悬停模糊将使图像模糊，直至悬停于上或被点击。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |blur-reveal=--]
|blur-amount=数字
|speed=数字
|float=true/false
|align=left/right
|width=px/rem/vw/%
|url=链接
|add-caption=true/false
|caption=文本
]]

悬停模糊切换将在悬停于上或被点击时切换显示的图片。在两张图片宽高比相同时表现最好。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |image-change=--]
|blur-amount=数字
|speed=数字
|float=true/false
|align=left/right
|width=px/rem/vw/%
|start-url=链接
|hover-url=链接
|add-caption=true/false
|caption=文本
]]

悬停滑动模糊揭示将用向所选方向相反的方向滑动移出的方法消去图片上遮盖的模糊。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |slide-blur-reveal=--]
|blur-amount=数字
|slide-direction=left/right/top/bottom
|float=true/false
|align=left/right
|speed=数字
|width=px/rem/vw/%
|url=链接
|add-caption=true/false
|caption=文本
]]

悬停滑动方块揭示将通过滑动消去图片上遮盖的黑块。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |slide-block-reveal=--]
|block-color=hex/rgb/hsl
|slide-direction=left/right/top/bottom
|speed=数字
|float=true/false
|align=left/right
|width=px/rem/vw/%
|url=链接
|add-caption=true/false
|caption=文本
]]

悬停图像揭示将使用一个由用户控制的滑杆切换图片。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |slide-revealer=--]
|block-color=hex/rgb/hsl
|float=true/false
|align=left/right
|width=px/rem/vw/%
|left-url=链接
|right-url=链接
|slider-start-percent=0-100
|slider-color=hex/rgb/hsl
|slider-circle-size=px/rem/vw/%
|add-caption=true/false
|caption=文本
]]

悬停分形噪点揭示将在揭示时消去图片上的分形效果。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |noise-reveal=--]
|fractal-size=1-999
|speed=数字
|float=true/false
|align=left/right
|width=px/rem
|background=color/url("")/gradient
|url=链接
|add-caption=true/false
|caption=文本
]]

悬停马赛克揭示将在揭示时消去图片上的马赛克效果。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |pixel-reveal=--]
|pixel-res=数字
|speed=数字
|float=true/false
|align=left/right
|width=px/rem
|url=链接
|add-caption=true/false
|caption=文本
]]

悬停放大将在悬停于上或被点击时放大图片。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |hover-enlarge=--]
|enlarge-amount=数字
|speed=数字
|float=true/false
|align=left/right
|width=px/rem/vw/%
|url=链接
|add-caption=true/false
|caption=文本
]]

点击并按住以全屏将使图片放大至全屏大小，且其文字描述会放在底部。若需使用，黏贴以下代码：

[[include :scp-wiki:component:image-features-source |click-fullscreen=--]
|speed=数字
|float=true/false
|align=left/right
|width=px/rem/vw/%
|url=链接
|add-caption=true/false
|caption=文本
]]

这些代码的所有示例都可以在组件页里找到。

这是可折叠信息栏。若需使用，复制并黏贴以下代码：

[[include :scp-wiki-cn:component:info-ayers
|page=component:info-ayers
|authorPage= 此处填链接
|comments=快看我！我是信息模块！耶！
]]

你可以在其组件页中查看该组件的示例。

该组件为一个在你评分模组右边的信息按钮，可以展示作者以及其它信息。若需使用，复制并黏贴以下代码：

[[include :scp-wiki-cn:credit:start]]
**SCP-XXXX：**标题
**故事/GOI 格式名称**
**作者：**[[*user 作者]]
**原文：**原文链接
**译者：**[[*user 译者]]
**图像：**在这里放上任意的图像授权信息
在这里加上别的你想让读者知道的东西
[[include :scp-wiki-cn:credit:more]]
可选的更多信息，这些会显示在一个新的窗口中。如果你不需要，删除“[[include :scp-wiki-cn:credit:more]]”
[[include :scp-wiki-cn:credit:end]]

📎信息模块内容警告

如果有文章需要的话，你也可以添加一个让读者知道本页有内容警告的组件。若需使用，可将以下代码黏贴到你信息模块的下方：

[[include :scp-wiki-cn:component:info-cw]]

该组件允许你在页面中使用行内折叠。若需使用，可将以下代码黏贴到你的页面中：

[[div class="inline-colmod"]]
折叠块前的文本
[[include :scp-wiki-cn:component:inline-colmod show=点击前显示的文字|content=点击后显示的文字]]
折叠块后的文字
[[/div]]

该组件允许你给你的骇灵街 GoI 格式启用一个特殊的 div 块。若需使用，可将以下代码黏贴到你页面的顶部：

[[module css]]
@import url('https://fonts.googleapis.com/css?family=ZCOOL+KuaiLe&display=swap');

.rmpostcontainer
{
    background-image: url('http://scp-wiki.wikidot.com/local--files/component:laruepost/LaRueDesk.png');
    background-repeat: no-repeat;
    width: 100%; max-width: 660px;
    height: 980px;
    margin: 0px;
        padding: 60px 20px 0px 60px;
}

.rmpostcontent
{
    font-family: 'ZCOOL KuaiLe', cursive;
    font-style: normal;
    font-size: 1.30em;
    color: #000;
    width: 530px;
    height: 880px;
    padding: 30px;
    margin: 0px;
    margin-top: -8px;
}

.rmpostmobiletitle
{
    display: none;
}

@media only screen and (max-width: 600px) {

    .rmpostcontainer {
        background-image: url("http://scp-wiki.wikidot.com/local--files/component:laruepost/LaRueMobile.png");
        background-size: 100%;
        background-repeat: repeat;
        width: 100%;
        height: auto;
        padding: 0px;
        padding-top: 0px;
    }

    .rmpostcontent {
        font-size: 14pt;
        width: 85%;
        height: auto;
        padding: 10px 10px 0px 30px;
    }

    .rmposttitle {
        width: auto;
        height: auto;
        padding: 0px 20px 0px 70px;
    }

}

[[/module]]

然后，你每想要在页面上放上的一页，就黏贴以下代码一次：

[[div class="rmpostcontainer"]]
@@ @@
@@ @@
[[div class="rmposttitle"]]
[[image https://scp-wiki.wdfiles.com/local--files/component:laruepost/LaRueTitle.png]]
[[/div]]
[[div class="rmpostmobiletitle"]]
La Rue Macabre
[[/div]]
[[div class="rmpostcontent"
]]
内容
[[/div]]
[[/div]]

如果那不是页面中的第一个骇灵页的话，你可以去除包裹标题的 [[div]]。

该组件能够自动更新你的页面，并提供对其它分部以及合著页面的支持。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:mega-cool-author-page-tool |inc-list= --]
|order= name/title/rating/created_at
|perpage= 1-250
|background-image= 链接
|shadow= yes/no
]]

对于不是你发布的合著页面，黏贴以下代码：

[[include :scp-wiki-cn:component:mega-cool-author-page-tool |inc-coauthor-header= --]]]

[[include :scp-wiki-cn:component:mega-cool-author-page-tool |inc-coauthored= --]
|name= 页面名称（本页的页面名称是 components-hub
|feat= 合著者
]]

该组件允许你几乎完全自定义整个 ACS 组件。除最后一个选项外，请在引入 ACS 后黏贴代码。

请参考组件页以获取用法介绍。

该组件允许你将折叠彼此嵌套。若需使用，黏贴以下代码作为你折叠的第一层：

[[include :scp-wiki-cn:component:coltop
| show=+ 展开
| hide=- 收起
]]
折叠内部的文本[[include :scp-wiki-cn:component:colend]]

在其中再次黏贴此代码以将其嵌套。

是不是很妙？

该组件可作为你页面的版头。若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki-cn:component:object-class-bar-source
|item-num=XXXX
|obj-class=项目等级
|site-resp=Site/Area-##
|director=名字
|rsch-head=名字
|task-force= MTF [名字]-##（“[代号]”）
|colorbar-bg-color=rgb(0,0,0)
|colorbar-bg-img=可选
|colorbar-one=full/half/none
|colorbar-two=full/half/none
|colorbar-three=full/half/none
|colorbar-four=full/half/none
|colorbar-five=full/half/none
|colorbar-six=full/half/none
|level=1/2/3/4/5/6
|secrecy=公开/受限/保密/机密/最高机密/其它
]]

该组件允许你在页面中加入一个世界观内的警告板。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:object-warning-box-source
|bg-image=https://这是一个链接.com
|bg-opacity=0.15
|bg-size=105% 105%
|text-top=根据监督者议会的命令
|text-bottom=以下文档为 #/XXXX 级机密

禁止未经授权的访问。

|object-number=XXXX
]]

该组件通过 CSS 替换了 tab 以给其一种古老的感觉。在使用该组件时推荐用短一点的分页标题。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:chicago-spirit]]

且应注意该组件专为 Sigma-9 打造。虽然在黑标里仍然可用，但是外观并没有达到最佳。

该组件在你的页面开头添加了一段不可见的文本作为预览。若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki-cn:component:preview
|text=文本]]

该组件允许你引入自定义 div 块以仿真出书本的模样。尽管是叫这个名字，但是该组件目前仅可模拟书页。若需使用，可将以下代码黏贴到你的页面中：

[[include :scp-wiki-cn:component:pages
| medium=vintage-book/plain
| style=
css
| contents=
这段文本将以手写体呈现
]]

该组件可用于制作观谬维基论坛帖，可以用到你的 GoI 格式或者观谬维基 SCP 里。该组件将仅能在与观谬维基或观缪轻量版版式共同使用时正常工作。若需使用，复制并黏贴以下代码：

[[include :scp-wiki:component:parawatch-forum-post
     color=这里填颜色名字或者#rrggbb |
     username=人物账户名 | ← 若为版主则带有“🗿 ”前缀
     date=月/日/年 (周) 时:分:秒 | ← 周指这天周几，三个大写字母
     postno=8位数 | ← 应随发帖时间增长
     depth=0/1/2/3/4…… | ← 该帖递进多少层
     content=实际论坛帖文在此。 ← 若跨越了多行，每一行结尾必须有空格
]]

你可以在撒手 michael 中看到这个组件的效果。

该组件允许你简单地将骄傲标志添加到你的页面中。你可以在本页顶部看到这个组件的效果。请参考组件页以获取用法指导。

尽管是叫这个名字，但是骄傲标记笔既可以在 Sigma-9 中运作，也可以在黑标中运作。

该组件允许你在你的评分模块上加入一个评分占比条，来展示你所获得的好评数与差评数的比例。若需使用，黏贴以下代码：

[[include :scp-wiki:component:ratio-bar base=--]]

上面的 [[include]] 将修改页面中所有的评分模块以展示评分占比条。该组件同样拥有一个独立的饼图模块，可以在不用修改任何评分模块的情况下引入。若需使用，黏贴以下代码：

[[include :scp-wiki:component:ratio-bar pie=--]]

推荐将饼图模块放入著作信息模块内。

该组件允许你使用红区 GoI 格式的版头，红区是一个与普罗米修斯实验室关系亲密的组织。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:redzone-advisory
|title=红区RedDB存档异步复制漏洞
|id=redzone-sa-########-[短一点的标题]
|updated=YYYY-M-DD
|published=YYYY-M-DD
|version=版本号
|impact=0.0 至 10.0 之间的数字
|worknd=true/false
|bugs=RZux#####
RZux####
|cve=CVE-YYYY-####
|cwe=CWE-###
CWE-###
]]

性别

身高

体重/体型

种族

发色

瞳色

外在特征

男性

70 英寸

苗条

高加索人

黑色

棕色/星形瞳孔

热情友好

女性

61 英寸

苗条

东亚人

黑色

灰绿色

衣着华丽

该组件包含有一个能够在不同的屏幕/分页大小之中自动格式化至仍然可读的自定义表格。

若需该组件的使用说明，请参考其组件页。

该组件允许你模拟 SMS 短信服务的外观与感觉。若需使用，可将以下代码黏贴到你页面的顶部：

[[include :scp-wiki:component:text-style]]

然后，对于真正的文本信息，添加以下代码：

[[div class="text-container-wrap"]]
+++ 你的发信人名称
[[div class="text-container"]]
[[div class="sent/recv"]]
[[span class="text"]]这是一段简单的文本[[/span]]
[[div class="sent/recv"]]
[[span class="text"]]这是一系列[[/span]]
[[span class="text"]]附加文本[[/span]]
[[/div]]
[[/div]]
[[/div]]
[[/div]]

注意该组件目前并不支持嵌入文件或图片。

该组件允许你展示被转换至用户所在时区的时间。示例：

若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:tz
| time=##:##，必须是 24 小时制格式
| tz=默认为 UTC
| date=YYYY-MM-DD，默认为今天
| text_before=默认为 "${time} ${tz} 即"
| text_after=默认为 "。"
]]

除 time 参数外所有东西都是可选的。

该组件是为了与 Wondertainment 版式共同使用而制作的。它在底部添加了系列导航链接并添加了一个开启或关闭版式的链接。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:vaf-links
| position=middle
| previous-page=
| previous-page-name=
| next-page=
| next-page-name=
]]

你可以在 …And I Think to Myself 中看到这个组件的效果。

该组件允许你引用一个外观为在 Void 中的帖子 div 块。Void 为宇宙内由匿名社区使用的类似 Twitter 的网站。若需使用，黏贴以下代码：

[[include :scp-wiki-cn:component:void-post
|profile-pic= 推荐文件宽度：≤150px
|username=
|handle=
|void-msg= 推荐长度：≤280 字符；随便多长都可以
|echoes= 转推数
|hums= 点赞数
|time-and-date= 建议格式：YYYY 年 MM 月 DD 日 - 上午/下午 H:MM
]]

该组件允许在底部显示你已经发布的 15 篇随机 SCP 与故事。它强制你将其放置在授权模块上方及导航页脚下方，但也建议把它放在脚注块后。若需使用，可将以下代码黏贴到你的页面中：

[[include :scp-wiki-cn:component:wikimodule |normal= --]]]

如果你想在文章的旁边展示评分，则改为黏贴以下代码：

[[include :scp-wiki-cn:component:wikimodule |ratings= --]]]

Sigma-9

该组件将它所应用的页面顶部的页眉居中。若需使用，可将以下代码黏贴到你页面的某处：

[[include :scp-wiki-cn:component:centered-header-sigma-9]]

该组件在桌面端尺寸的屏幕上启用了移动端侧边栏按钮，且额外地将主页面内容居中了。若需使用，可将以下代码黏贴到你页面的某处：

[[include :scp-wiki:component:toggle-sidebar]]

如果你正在使用一个版式，请确保该组件的 [[include]] 被放在那个版式的 [[include]] 后方。

你可以在 SCP-6009 中查看这一组件的运作效果。

该组件允许你在页面中添加一个骄傲标志。若需使用，黏贴以下代码：

[[include :scp-wiki:component:scp-pride]]

黑色标记笔

该组件将其所在页面的图像居中。特别推荐你将该组件与切换侧边栏或可折叠侧边栏共同使用。黏贴以下代码至你页面中的某处：

[[include :scp-wiki:component:centered-header-bhl]]

该组件会在桌面端将侧边栏隐藏至一个按钮之后，与其在手机版上的表现相似。若需使用，可以黏贴以下代码至你页面中的某处：

[[include :scp-wiki:component:toggle-sidebar-bhl]]

如果需要的话，你还可以修改按钮以令其契合任何你可能正在使用的自定义主题。若需如此，可以在 [[include]] 后方黏贴以下代码：

你可以在本页查看该组件的运作效果！

该组件将黑标侧边栏还原成它的第一版，给予其一种更为深色的色调。若需使用，可以黏贴以下代码至你页面中的某处：

[[include :scp-wiki:component:bhl-dark-sidebar]]

你可以在余烬旋流版式中查看该组件的运作效果。

该组件是 Rounderhouse 的个人自定义组件。若需使用，可以黏贴以下代码至你的页面中：

[[include :scp-wiki:component:rso]]

该组件由 Rounderhouse 定期更新与改动以实现对他文章 CSS 的修改。因此，不推荐你使用该组件除非你 A）是 Rounderhouse 或者 B）可以接受自己的页面会偶尔崩溃。

技术性/职员

该组件被用于警告读者他们正在阅读的文章中包含成人内容。其应仅在制作成人内容页面的掩藏页时使用。若需使用，黏贴以下代码：

[[include component:adult-splash slug=页面名称]]

该组件可以隐藏一个页面的标签。该组件禁止在技术团队未批准的情况下使用，且仅能用在迭代文章的第一个迭代中。若需使用，黏贴以下代码：

[[include :scp-wiki:component:hide-tags]]

详见技术内容守则以获取更多信息。

该组件允许你正确归因你页面中使用的文件，且也能让人们指导如何正确归因你的页面：

完成之后，请确保在页面中添加 _licensebox 标签。1Footnote 1.译注：本条于中文分部不适用。

你可以在本页底部查看该组件的示例。

该组件用于列出 S-CSS-P 浏览器扩展无法在其上正常运行的页面，该扩展可以给 SCP 维基的页面注入 CSS。若需将你的页面添加到其上，请修改该组件页并添加上你文章的页面名称。

该组件是用在 theme:（组件）页面中的。其允许你展示自己版式中使用的配色。若需使用该组件，可为每个方块黏贴一次以下代码：

[[include :scp-wiki:component:theme-squares -=-
| color1-name=我最喜欢的颜色
| color1-variable=—fav-color
| color1-info=(191, 144, 0)
| color1-has-light-text=0/1
]]

该组件将把链接转为近似书架上的书本之样式，支持自定义书本样式、底部隔板、listpage，且可搭配 :target 来与笔记本样式使用。

[[collapsible show="+ 展开代码" hide="- 收起代码"  ]]

只需引用一次：

[[include :scp-wiki-cn:component:bookshelf-source]]

可重复引用：

[[/collapsible]]

[[/div]]

[[/div]]
[[/div]]

[[/div]]

[[/div]]

[[/div]]

[[/div]]
[[/div]]

[[/div]]
[[/div]]

该组件是基于暗码版式与 Discord 聊天室组件的扩展，可以生成近似于 Discord 聊天页面的样式。其只适用于sigma-9版式。由于步骤较为复杂，请参见组件页面获取进一步的信息。

[[/div]]

该组件能在include里面使用用户名筛选。

[[module ListUsers users="."]]
[[include :scp-wiki:component:inc-loop c=__|p=<include 地址>]]
|<变量名>=%%title%%
]]
[[/module]]

可借此实现分别显示内容，给登录用户与未登录用户的效果。

[[include :scp-wiki:component:listusers-1 users="."]]
##red|%%name%%##
[[include :scp-wiki:component:listusers-2]]
##blue|游客##
[[include :scp-wiki:component:listusers-3]]

以插图方块为例，效果见下：

|name=https://o5command-int.wdfiles.com/local--files/tech-team:graphic-templates/scp-logo-cn-400.png
|align=center
|width=200px
|caption=你是%%title%%！
]]

ps: 此非中文站的组件，也未被中心页收录，但其有一定的用处，故放置于此。

。译者 Etinjat，来自 SCP-CN 维基。译文链接：/components-hub。遵循 CC BY-SA 协议。
[[/blockquote]]
[[/div]]
[[/div]]

更多详情请参阅授权指南。

文件名：SEELE's_coat_of_arms.png
图像作者：Jasper Chu
授权协议：CC BY-SA 4.0
来源链接：维基媒体

文件名：Umeko.jpeg
图像作者：Nunzia Catania
授权协议：CC BY-SA 3.0
来源链接：维基媒体

文件名：troll.jpg
图像名：1 Troll
图像作者：Kortdagbyen Island
授权协议：CC BY-SA 4.0
来源链接：维基媒体

文件名：J.Brahms_plays_Josef_Strauss.1889..ogg
图像作者：Johannes Brahms
授权协议：CC-0
来源链接：维基媒体

文件名：Angel.jpg
图像作者：Victoria Borodinova
授权协议：CC-0
来源链接：[https://pixabay.com/es/photos/mujer-%c3%a1ngel-alas-ni%c3%b1a-%c3%a1ngel-caido-6020697/]

[[/collapsible]]
[[/div]]