Plugin Slider
Introduced in Tiki8
Use this wiki plugin for Tiki 8 to create a mini-slideshow of content. PluginSlider can handle wiki syntax within itself, it can display text, images, video, flash, basically anything. This plugin is similar to both PluginTabs and PluginCarousel in what it does to content, the main difference is both the user interface and what it can display.
Table of contents
Parameters
Introduced in Tiki 8.Preferences required: wikiplugin_slider
| Parameters | Accepted Values | Description | Default | Since |
|---|---|---|---|---|
| (body of plugin) | Content separated by "/////" | |||
animationtime |
digits | Milliseconds between slides | 600 | 10.0 |
delay |
digits | Time in milliseconds between slideshow transitions (in AutoPlay mode). | 3000 | 10.0 |
height |
text | Height in pixels or percentage. Default value is complete slider height.
If the expand parameter set to Yes (y), then don't use percent only use pixels. |
Slider height | 8.0 |
showmultiple |
digits | Set this value to a number and it will show that many slides at once | 1 | 8.0 |
width |
text | Width in pixels or percentage. Default value is page width, for example, 200px or 100% |
Slider width | 8.0 |
buildarrows |
(blank) y n |
Set whether to show forward and backward buttons | y | 8.0 |
autoplay |
(blank) y n |
Set whether the slideshow will start running automatically; replaces startStopped option |
f | 8.0 |
autoplaydelayed |
(blank) y n |
Set whether there will be a delay in advancing slides | n | 8.0 |
autoplaylocked |
(blank) y n |
Keep playing the slideshow even if the user changes slides | n | 8.0 |
enablearrows |
(blank) y n |
Set whether arrows are clickable | y | 8.0 |
enablekeyboard |
(blank) y n |
Set whether keyboard arrow keys will work for this slider | y | 8.0 |
enablenavigation |
(blank) y n |
Set whether navigation links are clickable | y | 8.0 |
enablestartstop |
(blank) y n |
Set whether the play/stop button is clickable. Previously enablePlay |
y | 8.0 |
expand |
(blank) y n |
Set whether the entire slider expands to fit the parent element. The height parameter
needs to also be set |
n | 8.0 |
buildnavigation |
(blank) y n |
Set whether to show a list of anchor links to link to each panel | y | 8.0 |
hashtags |
(blank) y n |
Set whether to include a hashtag in the page URL, allowing links to specific panels | y | 13.0 |
pauseonhover |
(blank) y n |
Set whether the slideshow will pause on hover while the slideshow is active | y | 8.0 |
resizecontents |
(blank) y n |
Set whether solitary images/objects in the panel will be expanded to fit the viewport | y | 8.0 |
resumeonvideoend |
(blank) y n |
Set whether auto play stops until the video is complete (for supported video types) | y | 8.0 |
playrtl |
(blank) y n |
Set whether the slideshow moves right-to-left | n | 8.0 |
titles |
text separator: | |
Pipe-separated list of slider titles. Example:slider 1|slider 2|slider 3 |
8.0 | |
buildstartstop |
(blank) y n |
Set whether to show a start/stop button and add slideshow functionality | y | 8.0 |
stopatend |
(blank) y n |
Set whether the slideshow stops on the last page | n | 8.0 |
theme |
(blank)| construction| cs-portfolio| default1| default2| metallic| mini-dark| mini-light| minimalist-round| minimalist-square| office| polished| ribbon| shiny| simple| tabs-dark| tabs-light | The theme to use in slider. | default | 8.0 |
togglearrows |
(blank) y n |
Set whether side navigation arrows slide out on hovering and hide at other times | n | 8.0 |
togglecontrols |
(blank) y n |
Set whether slide in controls (navigation + play/stop button) on hover and slide change, hide at other times | n | 8.0 |
Themes
Themes available from Tiki9 up to Tiki12.0:
| default | construction | cs-portfolio
| |
|
|
|
| |
metallic | minimalist-round | minimalist-square
| |
|
|
|
| |
Themes available since Tiki12.1:
| default1 | default2 | mini-dark | mini-light
|
|
|
|
|
|
office | polished | ribbon | shiny
|
|
|
|
|
|
simple | tabs-dark | tabs-light
| |
|
|
|
| |
Example number 1
This code:
{SLIDER(titles="Title 1|Title 2" expand="n" width="100%" height="200px" resizecontents="n" theme="simple" buildarrows="y" autoplay="y" autoplaydelayed="y" buildstartstop="y" animationtime="600" delay="7000")}
{module module="last_modif_pages" maxlen="100" show_namespace="n" nobox="n" max="5" }
/////
{module module="last_files" nobox="n" max="5" }
/////
{module module="freetags_most_popular" type="cloud" max="25" nobox="n"}
{SLIDER}
Would result in:
Example number 2
"This code"
!!!+Tiki Fest Montreal 2018
{SLIDER(width="100%" height="500px" theme="tabs-light" expand="y" resizecontents="y" buildarrows="y" buildnavigation="y" buildstartstop="y" enablearrows="y" enablenavigation="y" enablestartstop="y" autoplay="y" pauseonhover="y" animationtime="1800" hashtags="n")}{img src="display1603" link="http://WikiSuite.org" responsive="y"}
///// {img src="https://tiki.org/display1593" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1594" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1612" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1610" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1613" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1609" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1608" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1607" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1614" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1604" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1602" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1600" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1559" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1558" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="https://tiki.org/display1603" link="https://youtu.be/HsgkqbxgMHo" responsive="y"}
///// {img src="display1560" link="http://WikiSuite.org" responsive="y"}
{SLIDER}
"Would result in "
Tiki Fest Montreal 2018
[-]
Related pages
Tips & Trick
There are case were the content of the slider (all slides) is displayed on load before the slider start.
CSS style to add to hide the slider onload
.tiki-slider > div {
display:none;
}
;){kind=link}