How To Easily Build A Beautiful WordPress Carousel Slider

This post contains affiliate links. Which means I will make a commission at no extra cost to you should you click through and make a purchase. Read the full disclosure here.

Have you ever found yourself browsing someone else’s image slider gallery and wondering how you can make one yourself? Just imagine how a WordPress Carousel Slider would look on your website or blog. Picture your amazing images that you could showcase in it.

How to create image sliders easily by using this free WordPress tool

But you’re probably also thinking they are complex to make. And that you’ll need to pay someone to build one. Or buy some software that can build it without you learning to code, right? It sounds like an expensive headache.

Good news: Building your own WordPress Carousel Slider can be headache-free and not cost you anything with the right tools!

Think I’m exaggerating? Then why not see for yourself by reading on below and trying it out to see the results. The tool I use is completely free, so it won’t cost you anything to try it.

Requirements

Before we go any further though, let’s take a look at what we’ll need. There aren’t many requirements to build your own beautiful WordPress Carousel Slider. But it’s important to have the basics covered!

Here’s what you’ll need:-

Enabling Your WordPress Carousel Slider In Jetpack

First of all, before we try to create our WordPress Carousel Slider. We need to enable the module in Jetpack. (For information on the 41 other modules included in this nifty plugin you should check out the detailed post Jetpack – 42 Powerful Modules To Customize Your WordPress Blog.)

Now, let’s go ahead and get the settings enabled.

In your main left-hand menu on WordPress.com if Jetpack has been installed correctly then an option for Jetpack should be available. For me, it is usually near the top of the dashboard.

WordPress menu for the Jetpack plugin

Click on Jetpack > Settings.

Stay on the Writing tab and scroll down to the Media section.

WordPress Carousel Slider setting disabled in Jetpack

Toggle on the option for Display images and galleries in a gorgeous full-screen browsing experience.

If you are a photographer, then you may also wish to toggle on the option for Show photo metadata (Exif) in carousel when available. As this can show additional details about your photo in the full-screen gallery, such as Aperture, Camera etc. You can find more details here.

You now also have the option to set the Colour scheme for your WordPress Carousel Slider. Which is limited to Black or White.

Once you’ve selected your colour scheme, click Save Settings in the top right.

WordPress Carousel Slider enabled in Jetpack Settings

Now we are all set to build a WordPress Carousel Slider into a post or page!

But First, About Those Images!

So, you may have noticed at the start I listed Images optimized for the web as a requirement. If you haven’t done this yet, I urge you to strongly reconsider optimizing your images using this simple guide.

Once you have your images ready it’s worthwhile getting them uploaded ready for when you build your WordPress Carousel Slider. As there are some extra details you can add in bulk to streamline the entire process.

Simply drag and drop your images like normal to your Media Library. And consider filling in the following information with your image gallery in mind:-

  • Title – Displays in bold larger text underneath your image and caption when shown in the full-screen gallery only. Remember: This also shows when you hover over images.
  • Caption – Displays as smaller text just below the image but above the Title. These also display underneath your images outside the full-screen view for Thumbnail Grid, Mosaic Gallery, Square Tiles, Tiled Columns, and Slideshow. They do not appear on Circles.

In any case, fill these in however you see fit. If you use the same image across multiple galleries then updating it in the Media Library will update all versions of it.

WordPress Carousel Slider example preview of full-screen view using the white colour scheme

How To Build The WordPress Carousel Slider

Next, go to the WordPress Editor for a post or page.

Click Add Media.

WordPress Editor Add Media Button

On the left click Create Gallery.

WordPress Carousel Slider Create Gallery Option

Select from the Media Library the images you want to display in the WordPress Carousel Gallery or if you haven’t added them yet. Select Upload Files.

Once you’ve selected all the files you want to include, click Create a new gallery in the bottom right of the window.

WordPress Carousel Slider Create a new gallery button

WordPress Carousel Slider Settings

Here a bunch of Gallery Settings will show. Let’s go through the options available.

Each image has the option to have a Caption added to it if you didn’t add one earlier. Note: Caption is a field in your Media Gallery, so you can pre-populate captions and avoid having to manually type them in each time.

Link To – Link To doesn’t affect any of the Types of gallery. It is only useful if you are not using the Jetpack WordPress Carousel Slider.

Columns – Allows you to set how many are in your gallery from 1 to 9. It is only available when the Type: Thumbnail Grid is selected.

Random Order – Shuffles the order of the images every time the page is reloaded.

Size – Influences what size the preview of the images in the gallery are – Thumbnail, Medium, Large or Full Size. Only affects the Thumbnail Grid when using Jetpack.

Type – How the gallery looks on the page – Thumbnail Grid, Tiled Mosaic, Square Tiles, Circles, Tiled Columns or Slideshow.

WordPress Carousel Slider Gallery Settings

Once you’ve picked your settings for your WordPress Carousel Slider you can click Insert Gallery.

That’s it – it’s that simple! You should now have a WordPress Carousel Slider on your post and page.

Previews & Live Versions

In order to see how the gallery will display you should Preview it. If you are viewing it from the Visual tab then it will display differently to the live version.

Want to see some live versions to get a better feel for what you can build yourself? Well, you’re in luck! I’ve created a separate page with examples of all the different Types of WordPress Carousel Slider you can build. Beware the page might be slow to load due to the unusually large amount of images on the page. It isn’t recommended to check them out on your mobile!

How To Edit A Previously Built WordPress Carousel Slider

Did the gallery not show up how you expected? If you want to go back and change any settings you can do this easily. Simply click on the gallery and then click the small Pencil icon. WordPress pencil icon that appears when there is an option to edit something on the page
This will reopen the window we had open earlier.

Overview Of The Different Gallery Types

There are 6 different types of WordPress Carousel Slider in the Jetpack plugin. In addition to the live examples of these galleries, which you can find here. Below you can find a smaller preview and some other things to keep in mind for each type. To give you an overview and help you to decide which is best for your needs.

Thumbnail Grid – Works best with the Thumbnail size, other sizes will break the uniform layout unless all your images are resized to the same dimensions.

WordPress Carousel Slider Gallery Example of Jetpack's Thumbnail Grid type

Tiled Mosaic – Images are tiled proportionally to their size.

WordPress Carousel Slider Gallery Example of Jetpack's Tiled Mosaic type

Square Tiles – All images are tiled as squares.

WordPress Carousel Slider Gallery Example of Jetpack's Square Tiles type

Circles – Images are cropped to circles using the centre point.

WordPress Carousel Slider Gallery Example of Jetpack's Circles type

Tiled Columns – Appears to work best with vertical images. Mixing tall with wide images can result in some tiles becoming tiny.

WordPress Carousel Slider Gallery Example of Jetpack's Tiled Columns type

Slideshow – Shows images proportionally within slideshow frame. Continuously cycles through all images in a loop. The only gallery that does not open into a full-screen gallery. Always displays as black regardless of Colour scheme selected in the Jetpack Settings screen.

WordPress Carousel Slider Gallery Example of Jetpack's Slideshow type

 

Let’s Recap!

With all this information you have all the tools and tips you need to build your own beautiful WordPress Carousel Slider.

Creating your galleries with Jetpack’s plugin in WordPress is quick and easy. Plus, you can rest assured the features are well supported since Jetpack is made by the same company that makes WordPress itself.

Pros

  • Quickly implement a beautiful and professional looking WordPress Carousel Slider.
  • No coding required.
  • Only free tools required (Jetpack).
  • Inbuilt comments for all images that use a WordPress Carousel Slider except for the Slideshow Type.
  • A linked full-size version of each image

Cons

  • Sliders generally prioritise visuals and therefore are not often optimized well for resource usage. Be mindful of this and use them sparingly.
  • The Thumbnail Grid type doesn’t scale well and can appear squished.
  • Some trial and error is required as images can look very different depending on their dimensions.
  • Galleries don’t preview accurately in the WordPress Editor’s Visual tab compared to the live versions.
  • Some customization is limited, such as the Slideshow type’s colour and the overall Colour scheme of the WordPress Carousel Slider. Unless you know advanced code.
  • Some Gallery Settings like Size and Link To don’t actually affect anything 99% of the time. Making it easy to waste time trying out different settings which do nothing. These should really be greyed out to improve usability.
  • No support for videos.

Related Posts:

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Get access to the FREE Pinterest Cheat Sheet for Mastering your websites Pins today!Download