Extension:输入框
This code base is maintained by the Readers Experience team. Code review only for UBNs or security fixes. |
![]() 发行状态: 稳定版 |
|
---|---|
![]() |
|
实现 | 标签 , 页面操作 , 搜索 |
描述 | 可讓使用者在wiki页面中添加预置的HTML表格 |
作者 |
|
最新版本 | Continuous updates |
MediaWiki | >= 1.45 |
数据库更改 | 否 |
许可协议 | MIT授權條款 |
下載 | |
|
|
前往translatewiki.net翻譯InputBox扩展 | |
問題 | 开启的任务 · 报告错误 |
输入框(InputBox)扩展可以添加已经创建好的HTML表单到维基页面中。 用户可以在输入框中输入文本以“填写”表单(输入文本、选择菜单项等)。
输入框最初是由Erik Möller为在维基新闻中加入创建条目框的目的而创建的。
安裝
- 下载文件,并解压
InputBox
文件夹到extensions/
目录中。
开发者和代码贡献人员应改从Git安装此扩展,输入:cd extensions/ git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/InputBox
- 請新增下列代码到您的LocalSettings.php 文件的底部:
wfLoadExtension( 'InputBox' );
- 完成 – 請导航至您的wiki上的Special:Version,以验证此扩展已成功安装。
示例
创建一篇新條目的输入框。
Wiki代码
<inputbox>
type = create
width = 30px <!-- with unit of measurement -->
break = no
placeholder = Page title
</inputbox>
输出结果
常见語法
输入框像这样构造:
<inputbox>
type = <!-- <input> type == search search2 create comment commenttitle fulltext move -->
bgcolor = <!-- Background color of parent <form>. -->
width = <!-- Width of text field (searchbox) in 'characters'. Unit: Characters #Default: 50 -->
page = <!-- Wiki pagename (i.e. page title) to post comment to, or move page to. No [[X]]. -->
default = <!-- Initial value of the text field. -->
preloadtitle = <!-- Content to prepopulate the title field with for a new comment -->
preload = <!-- Content to prepopulate the source editor with for a new topic/comment, or new page. -->
editintro = <!-- Wiki pagename of page to be transcluded as 'help text' shown above source editor window. -->
hidden = <!-- Any value will hide the text field, but not buttons whose links will still work. -->
searchbuttonlabel = <!-- Visual label for "Search full text" in type == search == fulltext. -->
searchengine = <!-- optionally "MediaSearch" (Extension:MediaSearch) "Search" #Default: local wiki default. -->
fulltextbutton = <!-- Visual label for "Search full text" -->
labeltext = <!-- labeltext -->
break = <!-- break -->
namespaces = <!-- namespaces -->
prefix = <!-- prefix -->
placeholder = <!-- placeholder -->
minor = <!-- minor -->
nosummary = <!-- nosummary -->
summary = <!-- summary -->
id = <!-- id -->
inline = <!-- inline -->
dir = <!-- dir -->
preloadparams[] = <!-- preloadparams[] -->
searchfilter = <!-- searchfilter -->
useve = <!-- useve -->
usedt = <!-- usedt -->
arialabel = <!-- arialabel -->
buttonlabel = <!-- Visual label for primary search button. -->
</inputbox>
Buttons are not exposed to assistive technology: currently the button elements generated by this template have no accessible label. Screen readers therefore announce only the element role (for example, "Button.") rather than a meaningful label. There is no reliable way to add an accessible label without access to the HTML code.
type
参数必须输入。
而所有的其他参数均为可选。
preloadparams[]
可以出现不止一次。
框的类型
默认情况下「提交」按钮位于输入框的下面。
可移動“提交”按钮至右侧,方法是使用換行參數來消除方塊和按鈕之間的換行:break=no
。
将“提交”按钮移至右侧对于使用搜索框时搜索建议覆盖了下方搜索按钮的情况很有用。
类型 | 示例 | 描述 |
---|---|---|
search
|
创建的搜索框的默认宽度为50字符。 输入的内容为要搜索的确切页面标题(按钮1)或是条目中的文本(按钮2)。 | |
create
|
创建新页面。 输入的内容为要创建的页面名称(对于已存在页面则是编辑页面)。 | |
comment
|
在输入框指定的页面下增加一个新段落(如果为新页面则会创建页面)。 | |
commenttitle
|
以输入框中输入的标题增加一个新段落。 标题可以用default= 参数指定。页面必须用page= 参数指定。 由於某些原因,當使用擴充功能時,用{{#tag}}啟用它時並不生效,只有使用<inputbox> 時才生效。 (在版本rev:47203引入)
| |
fulltext
|
仅显示搜索全文按钮,不显示精确匹配按钮(“前往”按钮)。 (在版本rev:45269引入) | |
move
|
将页面移动至另一个名字。 This also doesn't work when creating it by invoking a tag. (在版本gerrit:97559引入) |
对于type=search2
,默认的搜索按钮位置在同行右侧。
目前,似乎无法将其他参数添加到这种类型的输入框中。
这种搜索框将搜索其所在的整个维基。
类型 | 示例 |
---|---|
search2
|
参数
参数 | 描述 | 适用范围 | 结果 | 示例 | 兼容性 | |
---|---|---|---|---|---|---|
arialabel=
|
为输入框提供aria-label属性,以允许屏幕阅读器访问生成的标记。 參見 ARIA: aria-label 屬性。 | 所有类型 | <inputbox>
type=search
arialabel=Search the wiki
</inputbox>
|
| ||
bgcolor=
|
设置表格背景色(HTML颜色值)。 不要使用引号。 | 所有类型 | <inputbox>
type=search
bgcolor=gray
</inputbox>
|
? | ||
width=
|
设置输入框的宽度,单位为字符。 | 所有类型 | <inputbox>
type=create
width=24
</inputbox>
|
? | ||
default=
|
输入框中的默认文本。 | 所有类型 | <inputbox>
type=comment
default=User talk:Eloquence
</inputbox>
|
? | ||
preloadtitle=
|
Default text to add as the title for a new comment. | comment | <inputbox>
type=comment
preloadtitle=My comment title
default=Extension talk:InputBox
</inputbox>
|
| ||
preload=
|
当创建新页面时,此标题的页面将会被预先载入(参见手册:创建包含预加载文本的页面 )进空白编辑框。 | create, comment, commenttitle | <inputbox>
type=create
preload=Log
</inputbox>
|
? | ||
在上面或下面的输入框示例中输入一个不存在的页面标题,并分别点击“创建页面”或“新段落”按钮来测试此功能。 | ||||||
editintro=
|
通过这一参数指定的页面将会作为编辑指引显示在编辑窗口上方。 | create, comment | <inputbox>
type=comment
editintro=MediaWiki:Missingcommenttext
</inputbox>
|
? | ||
buttonlabel=
|
此参数将作为表单主按钮显示的文字。 | 所有类型 | <inputbox>
type=comment
buttonlabel=添加新的传言
</inputbox>
|
? | ||
hidden=
|
此参数指定不显示输入框。
此参数需要与参数 |
create, comment | <inputbox>
type=comment
editintro=Extension:InputBox/editintro comment
preloadtitle=Comment title
preload=Extension:InputBox/preload
hidden=yes
default=Extension talk:InputBox
buttonlabel=在讨论页留言
</inputbox>
|
? | ||
searchbuttonlabel=
|
此参数将作为表单“搜索全文”按钮显示的文字。 | search, fulltext | <inputbox>
type=search
searchbuttonlabel=深入探索
</inputbox>
|
? | ||
searchengine=
|
如果已安裝 1,此參數會設定查詢專頁為Search 或MediaSearch 二選一。 如果未使用此參數,則會使用使用者的(或wiki的預設)偏好設定。
|
search, search2 | <inputbox>
type=search
searchengine=MediaSearch
</inputbox>
|
| ||
fulltextbutton=
|
在“search2”表单上显示全文搜索按钮。 | search2 | <inputbox>
type=search2
searchbuttonlabel=深入探索
fulltextbutton=true
</inputbox>
|
? | ||
labeltext=
|
在左侧显示的文字。 | search2 | <inputbox>
type=search2
searchbuttonlabel=深入探索
labeltext=查找:
</inputbox>
|
? | ||
break=
|
是否在输入框和按钮之间插入换行。 默认为yes(使用换行)。 | 所有类型 | <inputbox>
type=create
width=24
break=no
</inputbox>
|
? | ||
namespaces=
|
在全文搜索中支持选择命名空间。
使用“ |
search, fulltext | <inputbox>
type=search
namespaces=Main**,Help
</inputbox>
|
? | ||
prefix=
|
注:下划线不等同于空格。 |
search, fulltext, create |
下面的按钮以 |
<inputbox>
type=search
prefix={{FULLPAGENAME}}/Archive
</inputbox>
|
? | |
placeholder=
|
设置当输入框为空时的占位文字。 | 所有类型 | <inputbox>
type=search
placeholder=搜索此维基
</inputbox>
|
| ||
page=
|
要发表评论或要移动的页面。 | comment, move | <inputbox>
type=comment
page=Project:Sandbox
</inputbox>
|
|||
minor=
|
次要的编辑。 | comment, create | <inputbox>
type=comment
page=Project:Sandbox
minor=true
</inputbox>
|
|||
nosummary=
|
对新评论不要求编辑摘要(标题)。 | comment | <inputbox>
type=commenttitle
page=Special:Mypage/inputbox test
nosummary=true
</inputbox>
|
|||
summary=
|
编辑摘要或移动理由。 | create, move | <inputbox>
type=create
default=Special:Mypage/inputbox test
summary=Foo
</inputbox>
|
|||
id=
|
<form> 的ID属性。
|
所有类型 | <inputbox>
type=comment
page=Project:Sandbox
summary=Foo
id=bar
</inputbox>
|
for some types | ||
inline=
|
将输入框作为内联元素(在开头不换行)。 任何带有yes/true意义的值。 | search2 | 在此输入: | 在此输入: <inputbox>
type=search2
inline=true
width=10
</inputbox>
|
||
dir=
|
书写方向从右到左(rtl)或从左到右(ltr)。 默认与页面语言的方向相同。 | 所有类型 | <inputbox>
dir=rtl
type=comment
page=Project:Sandbox
summary=Foo
</inputbox>
|
|||
preloadparams[]=
|
设置预载文本的参数。 参见使用预加载文本创建页面。 | create, comment, commenttitle | <inputbox>
type=create
preload=Log
preloadparams[]=param1
preloadparams[]=param2
</inputbox>
|
| ||
searchfilter=
|
指定在搜索中追加的参数。 | search, fulltext | <inputbox>
type=search
searchfilter=insource:foo
</inputbox>
|
| ||
useve=
|
当新的可视化编辑器扩展被安装且此参数被设为任何值时,将使用可视化编辑器创建页面。 | create, comment | <inputbox>
type=create
break=no
useve=true
</inputbox>
|
|||
usedt=
|
添加新段落时,输入框将会打开讨论页工具的新话题工具,如果安装了拓展,则该参数会设置为任何值。 | comment, commenttitle | <inputbox>
type=commenttitle
page=Project:Sandbox
usedt=true
</inputbox>
|
对于已存在的页面使用create只会跳转到编辑界面。
在这种情况下preload
被忽略。
对新页面使用comment是有效的。
这里使用的在MediaWiki:
命名空间下的文本只是作为示例,任何存在的页面都能被用于editintro
或preload
。
不幸的是preload
现在还不能对上传文件摘要生效。
Customizing with CSS
You can customize the inputbox in templates using CSS. First, wrap the inputbox in <div>
tags with an unique ID then use CSS selectors to change its appearance.
You could also give the inputbox itself an ID and use the ID in the CSS selectors. You could also add a custom search button or icon.
<templatestyles src="Template:Example/styles.css"/><div id = "inputbox-search-wrapper">
{{#tag: inputbox|
type = search
id = inputbox-search
placeholder = Search all pages
namespaces = Main**,Help**
}}<div class = "inputbox-search-icon"></div>
</div>
#inputbox-search-wrapper {
box-sizing: border-box;
height: 32px;
display: flex;
border: 1px solid var(--border-color-base, #a2a9b1);
border-radius: 10px;
}
#inputbox-search-wrapper input {
all: unset;
padding-left: 8px;
padding-top: 6px;
padding-bottom: 6px;
width: 180px !important;
font-family: 'Helvetica Neue', 'Helvetica', 'Liberation Sans', 'Arial', sans-serif;;
font-size: 14px;
line-height: 20px;
color: var(--color-base--subtle, #72777d);
}
#inputbox-search-wrapper input::placeholder {
font-family: 'Helvetica Neue', 'Helvetica', 'Liberation Sans', 'Arial', sans-serif;;
font-size: 14px;
line-height: 20px;
color: var(--color-base--subtle, #72777d);
}
#inputbox-search-wrapper input.mw-ui-button,
.searchbox .cdx-checkbox--inline,
#inputbox-search-wrapper .cdx-button,
#inputbox-search-wrapper div.mw-ui-checkbox {
display: none;
}
.inputbox-search-icon {
padding-left: 8px;
width: 25px;
background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/7e/Vector_search_icon.svg/18px-Vector_search_icon.svg.png");
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
对齐
如果你想要在页面右侧创建一个输入框,使用:
<div style="float:right; width:42em">
<inputbox>
type=create
</inputbox>
</div>
会显示:
在模板中使用输入框
为了创建许多类似的输入框,输入框可以在模板中使用。
然而,只有<inputbox>...</inputbox>
标签是透過模板中有{{#tag:inputbox | ...}}
的#tag 解析器函數使用,传递给输入框的模板参数才能够生效。
下面的例子是一个通过指定模板创建新页面的模板:
{{#tag:inputbox |
type=create
buttonlabel=创建新{{{1|条目}}}
preload={{{2|Template:Article}}}
}}
实例化此模板时,第一个参数提供一个已经创建好的项(默认为article
),就像按钮中显示的那样。第二个参数提供用来创建项的模板名称(默认为Template:Article
)。
例如:这段代码产生一个用于从项目模板创建新的项目的输入框:
{{Template:CreateNew|project|Template:Project}}
參見
此扩展用于一个或多个维基媒体项目。 这可能意味着扩展足够稳定、运作足够良好,可以用在这样的高流量的网站上。 请在维基媒体的CommonSettings.php和InitialiseSettings.php配置文件中查找此扩展的名称以查看哪些网站安装了该扩展。 特定wiki上的已安装的扩展的完整列表位于Special:Version页面。 |
此扩展在以下wiki农场/托管网站和/或软件包中提供: 這不是一份權威名單。 即使某些wiki农场/托管网站和/或软件包未在这里列出,它们也可能提供此扩展。 请检查你的wiki农场/托管网站或软件包以确认提供情况。 |