Wikia

Dungeons and Dragons Wiki

Help:Galleries, Slideshows, and Sliders/wikitext/examples

Create Talk0

This page describes how to use and customize photo galleries, slideshows, and sliders using wikitext.

See also Help:Galleries, Slideshows, and Sliders for the basics. Note that videos are also supported for galleries and sliders.

Gallery

A gallery is a collection of thumbnail images appearing as tiles on the page.

Basic example

Here is the basic gallery code:

<gallery>
Example1.png
Example2.png
Example3.png
</gallery>

Example with variations

The following code would produce a more complex gallery:

<gallery navigation="true">
Example1.png
Example2.png|Captioned
Example3.png|'''[[Help:Wikitext|Wikitext]]''' can be used in captions.
Example4.png|link=Help:Contents|This photo links to [[Help:Contents]].
</gallery>

In this example...

  • The first item is an image only.
  • The second item is an image with a caption.
  • The third item is an image with a caption that includes wikitext
  • The fourth item is an image that is linked to a wiki page, followed by a caption.

Slideshow

A slideshow is an image module that displays one image at a time, and automatically rotates through the included images.

  • Kittens!
  • Puppies!
  • Monkeys!
  • Giraffes!

Basic example

Here is the basic slideshow code:

<gallery type="slideshow">
Example1.png
Example2.png
Example3.png
</gallery>

Example with variations

The following code would produce a more complex slideshow:

<gallery type="slideshow" hideaddbutton="true" navigation="true">
Example1.png
Example2.png|Captioned
Example3.png|'''[[Help:Wikitext|Wikitext]]''' can be used in gallery captions.
Example4.png|Clicking photo takes you to [[Help:Contents]].|link=Help:Contents|linktext=Help:Contents
</gallery>

In this example...

  • The first item is an image only.
  • The second item is an image with a caption.
  • The third item is an image with a caption that includes wikitext
  • The fourth item is an image that is linked to a wiki page. It also includes a caption, as well as a description of the link.

Slider

A slider is an image module that spans the full width of the page and automatically scrolls through up to four images.

Tip: For best results, use images that are exactly 670 x 360px.

Basic example

Here is the basic slider code:

<gallery type="slider">
Example1.png
Example2.png
Example3.png
</gallery>

Example with variations

The following code would produce a more complex slider:

<gallery type="slider">
Example1.png
Example2.png|Example Two
Example3.png|Example Three|linktext=Great links
Example4.png|Example Four|link=Help:Contents|linktext=Interesting Pages
</gallery>

In this example...

  • The first item is an image only.
  • The second item is an image with a title.
  • The third item is an image with a title and a subtitle.
  • The fourth item is an image that is linked to a wiki page. It also includes a title and a subtitle.

Wikitext and options

The following reference tables address the customization options for each of these three image modules.

Gallery

Type Wikitext options Default setting
Layout options
Photo width (max) widths=[number of pixels] 200px
Number of columns columns=[number of columns] or perrow=[number of columns] Fit to page*
* If columns isn't specified, the number of photos displayed per row will adjust automatically according to the size of the browser window.
Gallery position position=[left/center/right] Left
Photo spacing spacing=[small/medium/large] Med
Photo orientation and cropping orientation=[none/landscape/portrait/square] None
Caption options
Caption position captionposition=[within/below] Below
Caption alignment captionalign=[left/center/right] Left
Caption size captionsize=[small/medium/large] Medium
Caption color captiontextcolor=[hex color code] Article text color
Border options
Border thickness bordersize=[none/small/medium/large] Small
Border color bordercolor=[hex color code] Accent theme color
Other
Hide "add photo" button hideaddbutton=true Not hidden
Gallery caption caption=[text displayed] No caption
The photos
Photos are separated by newlines.
Captions are optional. Brackets are used only for adding links within captions.
Links are optional, and use link=

Slideshow

Type Wikitext options Default setting
Layout options
Photo width (max) widths=[number of pixels] 300px
Cropping crop=[true] No cropping
Show recent uploads showrecentuploads=[true] False
Slideshow position position=[left/center/right] Right
Other
Hide "add photo" button hideaddbutton=true Not hidden
Slideshow caption caption=[text displayed] No caption
The photos
Photos are separated by newlines.
Captions are optional. Brackets are used only for adding links within captions.
Links are optional, and use link=

Slider

Type Wikitext options Default setting
Layout options
Orientation orientation=[left/right] left
The photos
Photos are separated by newlines.
Titles are optional.
Links are optional, and use link=
Subtitles are optional, and use linktext=

See also

Further help and feedback

Around Wikia's network

Random Wiki