按钮
在Wikidot中,可以使用按钮 (button) 来实现特定效果。按钮需要使用语法:[[button type text (attributes)]]。
其中text表示按钮呈现的文本,attributes包含class和style。语法中的type可以是:
除此之外还有一种类型使用特殊的语法:[[button set-tags +tag text="文本"]]以及[[button set-tags -tag text="文本"]]可以直接增减标签。
一些示例:
[[button source text="查看源代码"]]
[[button edit text="编辑本页"]]
[[button tags text="编辑标签"]]
[[button set-tags +某标签 text="添加标签"]]和[[button set-tags -某标签 text="删去标签"]]代码块
一般来说,我们使用的代码块语法为
[[code]]
[[/code]]但事实上,它存在另一种写法:
[[div class="code"]]
[[/div]]关于它们的区别:
[[code]]是真正意义上的代码块,具有转义功能,在内部几乎所有的代码都会以原始文本输出。
[[div class="code"]]只是形式上的代码块,不具备转义能力,仅在外观上与[[code]]相同。
但是,有一种语句即使在[[code]]内也无法被转义:[[include]]语句。
在这里我们准备了一个测试页面,随后使用以下代码:
[[code]]
[[include :brsandbox-mini:fragment:cold-testpage-1]]
[[/code]]
其输出内容为:
这是一些内容。
> 引用块你可以发现,代码块内显示的并非[[include fragment:cold-testpage-1]],然而也没有把目标页面的渲染效果显示出来。事实上,最终显示的文本为目标页面的源代码。
这种现象出现的原因是Wikidot的解析顺序。首先,系统会优先扫描并执行[[include]]指令,将目标页面的源代码直接替换,随后才开始解析格式标记,将[[code]]代码块内部的内容原样输出。因此,[[include]]的优先级高于[code]]的转义功能,导致代码块内最终显示的是被包含页面的源代码,而非[[include]]语句本身。
迭代
迭代在Wikidot的文章中十分常见,尤其是长文。但是迭代本身其实有很多可以说道的。
首先我们来看制作迭代的过程。假设你要创建一篇有3个迭代页的页面,那么可以按照以下步骤:
请依次创建三个段落页fragment:page-name-12、fragment:page-name-2和fragment:page-name-3,随后创建主页面(留空)。注意,一定要按照时间顺序分别创建这三个迭代页,否则最后的迭代页顺序会混乱。
在各段落页中放入内容。如果所有段落页包含共同内容,请不要将共同内容放入段落页中3。将所有指向其它迭代页的链接全部换成page-name/offset/X的格式,其中X是一个数字。注意,X应当从0开始计数,在本例中即填入0、1或2。
在三个段落页最底部找到父页面按钮,设置父页面为page-name。
在主页面内输入以下代码,并加上评分模块、作者信息等:
[[module ListPages category="fragment" parent="." order="created_at" limit="1" offset="@URL|0"]]
%%content%%
[[/module]]
但是,你真的仔细研究过这段代码的作用吗?
- module ListPages:在Wikidot中,module4用于提升操作的便捷性,而ListPages则是module的一种,用于列出符合要求的所有页面。
- category="fragment":category翻译为“分类”。此处代表列出的页面需要是fragment分类,即段落页。
- parent=".":parent表示父页面,点在这里代表当前页面。合起来表示列出的页面需要以当前页面为父页面。
- order="created_at":order即顺序,此处表示按照创建时间顺序列出页面。这就是为什么要依次创建段落页。
- limit="1":limit即限制,此处代表每次最多显示1个页面。
- offset="@URL|0":offset是最抽象的一个属性。简单来说,offset本意为“偏移”,在ListPages中表示偏移多少个页面。@URL表示从URL中读取offset的值,|0表示当无法从URL中读取到时,就填0。举个例子,你现在到达了第二个页面,URL为https://XXX.wikidot.com/XXX/offset/1,此时offset就是1,随后就告诉ListPages,跳过前面1页(即第一页),来到第二页。若offset变成2,就代表跳过前面2页来到第三页。
- %%content%%:这是ListPages中的占位符,表示页面的全部内容。
综合以上内容,我们可以得到迭代的完整工作流程:找到所有段落页——找到父页面为本页面的段落页——按照创建时间排序——每次只显示1个页面——把段落页的内容填充到本页面——根据URL动态调整显示的页面。
module嵌套
一般情况下,module是无法嵌套的。例如,下面的代码:
[[module ListPages tags="+原创" order="created_at" limit="5"]]
[[span class="red"]]%%title%%[[/span]]
[[module CSS]]
.red { color: red; }
[[/module]]
[[/module]]然而,我们可以通过一种特殊占位符%%content{0}%%来解决这一问题,以下代码可以正常生效:
[[module ListPages tags="+原创" order="created_at" limit="5"]]
[[span class="red"]]%%title%%[[/span]]
[[%%content{0}%%module CSS]]
.red { color: red; }
[[%%content{0}%%/module]]
[[/module]]
加了%%content{0}%%后CSS能生效,是因为Wikidot的解析引擎在处理ListPages时,会对每个迭代项进行内容合法性校验。[[module CSS]]最终会解析为HTML标签<style>,当Wiki动态检测到<style>标签这类非标准内容时,会导致整个条目失效。
而%%content{0}%%虽然最终渲染为空,但它是一个ListPages中的合法占位符。Wikidot会先解析%%content{0}%%,从而正常得出[[module CSS]]。此时,代码会变成这样:
[[span class="red"]]第一个页面[[/span]]
[[module CSS]]
.red { color: red; }
[[/module]]
[[span class="red"]]第二个页面[[/span]]
......
[[span class="red"]]第五个页面[[/span]]
[[module CSS]]
.red { color: red; }
[[/module]]此时,浏览器会将所有的[[module CSS]]转化为<style>。这时,虽然这段CSS被重复写了5次,但它是一个合法的CSS,自然可以对列出的页面生效。
页面统计
一般我们想要统计网站中各类页面的数量时,可以利用ListPages和%%total%%占位符,例如:
[[module ListPages tags="+原创 +层级" limit="1"]]
原创的层级页面有:%%total%%个
[[/module]]然而,当我们有某些更复杂的需求时,可能需要把这些数据以变量形式存储。此时,我们可以利用前文介绍的module嵌套,使用下面的代码:
[[module ListPages tags="+原创 +层级" limit="1"]]
[[%%content{0}%%module CSS]]
:root {
—original-levels: %%total%%;
}
[[%%content{0}%%/module]]
[[/module]]
通过这样的方式,我们把页面的数量存入CSS变量系统中,这可以满足制作和页面数量可视化相关的需求。
链接与锚点
在Wikidot中,除了内部链接(三括号标记)和外部链接(单括号标记),还存在第三类链接,它的形式和HTML中的<a>标签相同,其代码为[[a href=""]]内容[[/a]]。
代码的href中填入链接,可以是页面名称,完整URL或锚点。
Wikidot中,锚点的使用方法为:在锚点链接处写[#anchor 点击跳转],并在锚点目标处写[[# anchor]],其中anchor为锚点名称。
在页面HTML的结构中,锚点目标会解析为<a name="anchor"></a>,锚点链接则会解析为<a href="#anchor">点击跳转<a/>。当我们跳转至锚点目标后,链接末尾会添加井号和锚点名称。例如,点击这里后,URL应该会变成https://the-backrooms-yh.wikidot.com/random-trivia#benjiedingbu。
锚点不止可以跳转到同页面的不同位置,它还可以跳转到其他页面。例如,点击这里就可以跳转至其他页面。只需要利用前面所讲的URL会变化的特性,就可以达到这样的效果。具体代码为:[[[跳转页面的名称#目标锚点名称|点击跳转]]]或[跳转页面的URL#目标锚点名称 点击跳转]。
页面中的标题自带锚点名称。例如,#toc0就是页面的第一个标题,#toc1是第二个,以此类推。跳转到第一个标题。
在HTML结构中,你可以看到body内有一个<a name="page-top"></a>,这是默认就有的一个锚点,你可以用它跳转到页面最顶端。
给页面添加这一行CSS:html { scroll-behavior: smooth; },即可让锚点跳转的过程变平滑。本页面就使用了这一行代码。
#expr和#ifexpr
#expr
Wikidot中存在一种语法[[#expr]],支持四则运算、括号、指数、取余、绝对值、布尔运算。以下是一些例子。
| 代码 | 输出内容 |
|---|---|
| [[#expr 3^3]] | 27 |
| [[#expr 8%3]] | 2 |
| [[#expr abs(-3)]] | 3 |
| [[#expr 3==3]] | true |
| [[#expr 2>3]] | false |
| [[#expr 3!=3]] | false |
| [[#expr (3==3) + 0]] | 1 |
| [[#expr (3==3) + 1]] | 2 |
| [[#expr (3==3) + (2>3)]] | 1 |
| [[#expr (3==3) + (2<3)]] | 2 |
#ifexpr
[[#ifexpr]]是[[#expr]]的功能拓展,其作用是判断。语法为:
[[#ifexpr 关系式 | 真值内容 | 假值内容]]| 代码 | 输出内容 |
|---|---|
| [[#ifexpr 2<3 | 真 | 假]] | 真 |
| [[#ifexpr 2>3 | 真 | 假]] | 假 |
| [[#ifexpr 2>3 | 真 | ]]6 | |
| [[#ifexpr 2<3 | | 假]] | |
| [[#ifexpr 1 | 真 | 假]] | 真 |
| [[#ifexpr 0 | 真 | 假]] | 假 |
| [[#ifexpr 3-2 | 真 | 假]] | 真 |
[[#ifexpr]]不支持嵌套。


