Slideshow Block

This guide will show you how to use the Slideshow block to add an interactive image slideshow to a post or page.

In this guide

1. Add the Slideshow Block
2. Add Images
3. Add Additional Images
4. Edit Slideshow
5. Reorder Images
6. Block Toolbar
7. Block Settings
   1. Autoplay
   2. Effects
   3. Image Settings
   4. Advanced

Add the Slideshow Block

To add the Slideshow block, click on the + Block Inserter icon and search for “slideshow”. Click it to add the block to the post or page.

Add a new block and search for Slideshow.

💡

Using your keyboard, you can also type /slideshow on a new line and press enter to quickly add a new Slideshow block.

Type /slideshow in a new block.

For more, visit our detailed instructions on adding blocks.

Add Images

When you first add a Slideshow block, you’re given two options: Upload and Select Images.

Uploading or selecting images on the Slideshow block.

Upload allows you to upload a new image or multiple images from your computer to your website.

Select Images lets you choose from previously uploaded images in your Media Library, or choose from Google Photos, or the Pexels Free Photos and Openverse photo libraries.

Add Additional Images

You can add additional images to your slideshow using the Upload an image option below the slideshow you created:

Add additional images to a slideshow.

Edit Slideshow

You can use the Edit Slideshow button in the toolbar to add or remove images or rearrange the order in which they appear.

Edit Slideshow button on the block toolbar.

Reorder Images

The images are added to the slideshow in the order you select them. You can reorder the images using the Edit Slideshow option. When you edit the slideshow, you’ll notice a number next to each image when you select it. This number indicates what order the image will appear on your Slideshow block.

Reordering images on the Slideshow block.

Block Toolbar

When you click on the block, a toolbar of options will appear above it:

Slideshow block toolbar

The Slideshow block has the following options in its toolbar:

• Change block type.
• Drag the block.
• Move the block up or down.
• Change alignment – to left, right, and center, as well as wide width and full width if supported by your theme.
• Edit Slideshow.
• More options.

Block Settings

When you select a block, you will find additional block settings in the right sidebar. If you do not see the sidebar, you may need to click the Settings icon in the top-right corner to bring up the settings. This icon looks like a square with two uneven columns:

Click the Settings icon to open the block settings

The Slideshow Block has multiple settings you can adjust in the Block Settings sidebar.

Slideshow block settings

Autoplay

Enable this option to have your slideshow move between images automatically.

When enabled, a pause button will appear on the slideshow to let viewers pause the slideshow. You can also select the delay (in seconds) between automatic transitions:

Pause button on the Autoplay-enabled Slideshow block.

Effects

In the Effects tab, you can choose between Slide and Fade effects for your slide transitions.

Transition effects on the Slideshow block.

Image Settings

In the Image Settings tab, you can choose the image sizes for the Slideshow block among the Thumbnail, Medium, Large, and Full-Size options.

Image Size on the Slideshow block.

Advanced

For more, visit our detailed instructions on Advanced settings.