AHC and ESSL Wordpress Hosting Service

Slideshow Shortcode

Using the Slideshow Shortcode

This page explains how to add an slideshow to your page or post using a WordPress shortcode.

It is important that all the images you use in a slideshow are the same dimensions – the easiest way to accomplish this is to resize images before you upload them, and tell the shortcode to use the “full” versions.

The easiest way to insert a slideshow is to start by using the wordpress gallery tools:

  1. Click on the Add Media button above the editor to open the wordpress media browser
  2. Click on the link in the left hand column to “Create Gallery”
  3. Choose the slides from the ones available, or upload new ones.
  4. Click on the Create New Gallery button
  5. Put the images in the order you want them (drag and drop)
  6. Click on the Insert Gallery button
  7. This will put the images you selected in a “gallery” in the editor. Switch to text mode using the tab in the top right of the editor, and you will see the gallery “shortcode”.
  8. All you need are the ids from this shortcode – delete the other attributes and change the name from “gallery” to “slideshow” and add any attributes you need for the slideshow.
gallery-slide-1
The Wordpress media browser “Create Gallery” interface

To embed a slideshow in your page, use the slideshow keyword with any (or none) of the following options:

Available options

order
[ASC or DESC – default ASC] The order to show images
orderby
[any column name or names from the wp_posts table – default ‘menu_order ID’] the order images are shown in the slideshow. When you are on the gallery tab of the upload/insert popup, you can drag and drop images to order them (menu_order). To order by image title, you would use ‘post_title’ here.
id
[page/post ID – defaults to the ID of the current page] ID of the page/post which the images are attached to
size
[image size – default “medium”] – one of the image size labels defined in WordPress.
class
[name of CSS class to use for the slideshow container – default ”] This could be used to format the slides differently or change the slideshow behaviour…
caption
[0 or 1 – default 1] Whether to include a caption in a semi-transparent overlay at the bottom
navigation
[0 or 1 – default 1] Whether to include the navigation “blips” in a semi-transparent overlay at the bottom
interval
[number – default 5000] The interval in milliseconds between slides
include
[comma-separated list of numbers – default ”] you can use this to include specific images in the slideshow by putting their image IDs in the list.
exclude
[comma-separated list of numbers – default ”] you can use this to exclude specific images in the slideshow by putting their image IDs in the list.

NOTE: Image IDs can be found in the media editor, either through the main Media menu or in the list of images on the Gallery tab.

© Copyright Leeds 2017