Search form: A bit of a tightening up of the language.
← Older revision
Revision as of 01:43, 29 May 2015
Line 627:
Line 627:
MediaWiki skins usually include a search form that can be used to search the wiki. If the feature is enabled and the form is setup correctly this form usually also supports search suggestions. MonoBook does this as part of the sidebar, while other skins such as Vector have a dedicated place for the search form.
MediaWiki skins usually include a search form that can be used to search the wiki. If the feature is enabled and the form is setup correctly this form usually also supports search suggestions. MonoBook does this as part of the sidebar, while other skins such as Vector have a dedicated place for the search form.
−
To start the search form
lets
begin with the form itself:
+
To start the search form
,
let's
begin with the form itself:
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
Line 636:
Line 636:
</syntaxhighlight>
</syntaxhighlight>
−
A search form itself uses the HTTP GET method rather than a POST. As a result you can't include any query arguments in the action="". So a search form is built initially of a form with the action pointed to the wiki's index.php and a hidden input with the search page's title to ensure it's in the URL.
+
A search form itself uses the HTTP GET method rather than a POST. As a result you can't include any query arguments in the
<code>
action=""
</code>
. So a search form is built initially of a form with the action pointed to the wiki's index.php and a hidden input with the search page's title to ensure it's in the URL.
−
You should probably give the form itself an id. Keep in mind that MediaWiki supports autocompletion of the search form.
Right now
in 1.18 MediaWiki will only look for search forms with one of the id's "searchform" "searchform2" "powersearch" or "search". So the best practice is to use id="searchform" for your form.
Hopefully
I
may
expand
that
later
in
MediaWiki
to support search forms better. I think I
'
ll use class=
"mw-search"
,
so you might as well include that as well in
your form
as well
.
+
You should probably give the form itself an id. Keep in mind that MediaWiki supports autocompletion of the search form.
Starting
in
version
1.18
,
MediaWiki will only look for search forms with one of the id's "searchform" "searchform2" "powersearch" or "search". So the best practice is to use id="searchform" for your form.
It
is
recommended
you
use
the
CSS
'
'
"mw-search"
''
for
your form.
−
Moving on, naturally every search form needs a text field to enter a search query into. At
it's
base level you can use this helper method to build a search input:
+
Moving on, naturally every search form needs a text field to enter a search query into. At
its
base level you can use this helper method to build a search input:
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
Line 646:
Line 646:
</syntaxhighlight>
</syntaxhighlight>
−
However this helper supports an array
input to change the intput that
is output
.
I'll
explain
some
of
the
common important points
:
+
However this helper supports an array
,
which
is output
to
the
user's
screen.
Note
that
:
−
+
*The form uses <code><nowiki><input type="search"></nowiki></code> by default. A browser that supports this type of input field usually display it with a special style.
−
Firstly
the input
that
is
output
by
default
uses
type="search". Note that in the browsers that support this they usually give
a
search input special styling. As a result if you are doing
special
styling
like what Vector does for
it's
simple search you may want to override this and force MediaWiki to output a text
input instead
of
a
search
input
:
+
*This
means
that
,
if
you
wish
to
add
a special
style
like what Vector does for
its
simple search
,
you may want to override this and force MediaWiki to output a text
<code><nowiki><
input
type="text"></nowiki></code>
instead
.
See
the
following example
:
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
Line 660:
Line 660:
</syntaxhighlight>
</syntaxhighlight>
−
Note that the array is basically a list of attributes that are modified with the pieces important to a search input then passed to the
Html::
method that generates the input. This means you can add just about any
html
attribute that you want. Feel free to use it to add a CSS class, a inline style, some
html5
data- attribute, or so on.
+
Note that the array is basically a list of attributes that are modified with the pieces important to a search input then passed to the
HTML
method that generates the input. This means you can add just about any
HTML
attribute that you want. Feel free to use it to add a CSS class, a inline style, some
HTML5
data- attribute, or so on.
+
+
Next we're going to need a search button so that the user can submit the search. However this helper has 3 different modes to keep in mind. MediaWiki supports two forms of search.
+
*The default "Go" search which may redirect directly to a page if the search term matches a page's title.
+
*A "Full Text" search that will always go to the search page.
−
Next we're going to need a search button so that the user can submit the search. However this helper has 3 different modes to keep in mind. MediaWiki supports two forms of search. The default "Go" search which may redirect directly to a page if the search term matches a page's title. And a "Full Text" search that will always go to the search page.
The search input's helper supports both a 'go' mode and a 'fulltext' mode. The 3<sup>rd</sup> mode is an 'image' mode which outputs a 'go' mode button but does it using an image instead of text. Vector uses this last mode to create
it's
simple search icon. This helper also accepts an array of attributes as the second argument. The difference here is that in the 'image' mode the required 'src' attribute and optional 'alt' attribute go on the <code><nowiki><img></nowiki></code> while the rest of the attributes you specify go on the <code><nowiki><button></nowiki></code>. Here are some examples:
+
The search input's helper supports both a 'go' mode and a 'fulltext' mode. The 3<sup>rd</sup> mode is an 'image' mode which outputs a 'go' mode button but does it using an image instead of text. Vector uses this last mode to create
its
simple search icon. This helper also accepts an array of attributes as the second argument. The difference here is that in the 'image' mode the required 'src' attribute and optional 'alt' attribute go on the <code><nowiki><img></nowiki></code> while the rest of the attributes you specify go on the <code><nowiki><button></nowiki></code>. Here are some examples:
<syntaxhighlight lang="php">
<syntaxhighlight lang="php">
Line 675:
Line 675:
</syntaxhighlight>
</syntaxhighlight>
−
The tradition in
Mono Book
and Vector for
id's
here is to use search Go Button and MW-search button for a pair of Go and Full Text Search buttons, both with a searchButton class. And to use the
id
search Button for a Vector simple search style image button. The examples for those cases:
+
The tradition in
MonoBook
and Vector for
CSS IDs
here is to use search Go Button and MW-search button for a pair of Go and Full Text Search buttons, both with a searchButton class. And to use the
ID
search Button for a Vector simple search style image button. The examples for those cases:
<syntaxhighlight lang="php" style="overflow:auto">// A "Go" button
<syntaxhighlight lang="php" style="overflow:auto">// A "Go" button
<?php echo $this->makeSearchButton( 'go', array( 'id' => 'searchGoButton', 'class' => 'searchButton' ) ); ?>
<?php echo $this->makeSearchButton( 'go', array( 'id' => 'searchGoButton', 'class' => 'searchButton' ) ); ?>
Line 684:
Line 684:
</syntaxhighlight>
</syntaxhighlight>
−
There's no standard for toggling between a classic Go+Search and a simple search as that introduction was specific to Vector. You're also free to just have a plain go button with a "Search" title if it fits your theme. The old
mono book
had a config option to only have a Go button and instead have a power search link
but
I
won't
go
into
that
here
.
+
There's no standard for toggling between a classic Go+Search and a simple search as that introduction was specific to Vector. You're also free to just have a plain go button with a "Search" title if it fits your theme. The old
MonoBook
had a config option to only have a Go button and instead have a power search link
–
that
is
beyond
the
scope of this
manual
.
==== Footer links ====
==== Footer links ====