How to Create a Slideshow in WordPress

In this tutorial, you will learn:

• How to create a WordPress.com account.
• How to install and activate JetPack.
• How to connect JetPack with your WordPress.com account.
• Hot to enable JetPack shortcodes for Presentations.
• How to use the Presentations shortcode to create attractive slideshows.

In order to use the needed shortcode for this demonstration, please be sure that you have a WordPress.com account, and that JetPack is installed on your self-hosted web site, and connected to your WordPress.com account. JetPack is the tool that provides the Presentations shortcode we will be working with.

OK, with JetPack enabled, let’s turn on the extra shortcodes.

1. From your WordPress Dashboard, click JetPack, then Settings.
2. Click the Writing link across the top.
3. Turn on Shortcode Embeds.

When creating your Slideshow or Presentation, it will consist of various slides for which you can configure each slides transition, rotation, scale, fade, and background. Backgrounds can be images or colors. Use colors if you want to type the text for each slide.

The default transition is down. I will be leaving the default for this demonstration. Other values include: right, up, left, and none. I will not be using the rotation and scale properties in this example. Fading between slides is the default behaviour. I won’t be adjusting that for this Presentation.

In this example I will include 5 slides as background images.

Let’s begin.

1. From you WordPress Dashboard, go to Posts, then open the Post Editor for a new or existing post.
2. Switch to Text view to prevent the Visual Editor from making changes to the codes you type.
3. Start with an opening and closing “presentation” shortcode. Type an open square bracket, then the word presentation, then a closing square bracket. Press Enter twice, then open a square bracket, then type a slash, then the word presentation, then a closing square bracket.
4. Now, go back inside the opening of the presentation shortcode to set the size and transition duration for each slide.
5. Just after the word presentation, put a space, then type width equals 600, then a space, then height equals 375, then a space, then duration equals 5.
6. Save the post. We will come back to it in a second.

With 5 images ready to be used in the Slideshow, let’s now upload them to the WordPress Media Library.

1. From your WordPress Dashboard, click on Media, then Add New. If you right click the Add New link, you can open it in a new Tab in most browsers.
2. Click the Select Files button.
3. Locate the images on your computer, select them, and click Open. Using Ctrl+click allows you to select multiple files to upload at once.
4. Now we will need the URLs of the images. Click the Edit link next to the first image. It will open in a new Tab. Copy the File URL to a text document. Close the Tab.
5. Do the same for the remaining images.
6. Go back to your post.
7. In between the Presentation shortcode, create slide shortcodes for each image. Type an open square bracket, then the word slide, then a space, then bgimg equals open quotes, then paste in the image URL, then close the quotes, then close the square bracket. Now close the slide shortcode by typing an opening square bracket, a slash, the word slide, then a closing square bracket. Press Enter. Then repeat for the other images.
8. Save and View.