How to make a slider using an image gallery in WordPress
Galleries are an essential part of our site as they allow us to show, in the best way possible, essential images that could contain valuable information for our site, one of the most popular gallery types is the slider because this fits almost every website and could be shown anywhere allowing us to see each image and detail it perfectly, on this tutorial, we will see how to make a slider using a gallery in WordPress.
In this tutorial we will see how easy is to create a slider gallery using WP Media Folder and the Gallery add-on, the best plugin for the best gallery possible ;)
Table of content
Say goodbye to messy media library.
WP Media Folder lets you categorize files, sync folders with
cloud storage, create amazing galleries and even
replace images without breaking links.
Optimize your media workflow today
Show your images using the WP Media Folder Gallery manager
Using WP Media Folder, we can create galleries from many places such as the Media Library, its own Gallery Manager, Posts, and Pages, using the Classic Editor or a popular Page Builder like Elementor using a block, allowing us to easily create galleries in the fastest way possible!
Let's create a gallery using the Gallery Manager, for this, go to Media Library > Media folder Galleries.
On this page, click on +Add New Gallery, and type the gallery name in the pop-up that will appear, there will be many options like setting the gallery theme directly.
Now we are in the gallery dashboard, we can start uploading images with the drag 'n drop system or using your PC file system, we can also select the ones that we have on our site uploaded already.
Let's see first how to use images that are already in the media library, for this, click the WordPress icon.
This option will open our media library on a modal where we will be able to see all the media folders created with the plugin and media inside, so we can start selecting all the images that we want, and finally, click on Import images.
The images will be added to the gallery dashboard.
Now, let's see how to upload images directly from our PC to the gallery manager, for this, click on the folder icon.
This option will open the PC file explorer, we will be able to navigate between all the folders on our PC to select the images that we want and upload those directly.
The images will appear in the gallery dashboard, allowing us to rearrange them and remove them if needed.
We will be able 3 options in the gallery dashboard, General, Display settings & Shortcode, and Preview.
from the Display settings & Shortcode, we will be able to select the theme and adjust it to make it fit our site and what we want to show in the gallery.
On the Preview, we will be able to see what the gallery looks like before publishing.
We have 2 slider galleries available here, the Slider, and the Flow Slide, let's see both themes and options available on each theme.
Slider, is a good gallery theme when we have many images, it's the classic slider theme that we can use to show more than one image on each slide (with the possibility of adding 1 image as well).
Under the options, we can select how big we want to show the image, the number of images per slide, the transition duration between each slide, if we want the slides to run automatically, as well as the main configurations from a gallery like the order and the color of hover, title, and the description.
We can set the gallery and then, check the preview tab to see the gallery quickly.
Now we have the theme Flow Slide, a good slider gallery to focus on an image with a good 3D animation (you can check it live on the video at the end of the post).
Under the settings, we can select how big we want the image to be shown as well as the main settings like the size, the action on click, and the color of the title, hover, and description.
Let's check the Preview.
The best thing is that we can check this from the post or page where we want to add the gallery directly and all the settings will be available for us, let's see how to do it!
Inserting a slider gallery directly from our Posts and Pages
Now that we learned how to create a gallery directly from the gallery manager, let's check how to insert it and adjust the galleries directly from our Post or Page (or where we want to publish it).
For this, let's go to the page/post where we want to insert it, it is good to note that we can use popular page builders but in this tutorial we will use the default Gutenberg editor from WordPress.
Look into the blocks for the WPMF Gallery Addon block and insert it into the page.
This will insert a section in our page editor where we can select the gallery that we created before, let's select it!
This option will load a pop-up with the Gallery Manager inside so we can create galleries or set up our gallery further directly from there, for now, let's click on INSERT to insert this gallery in the content.
The preview will load directly in the content.
On the right tab all the options like selecting another theme and adjusting the theme itself will appear so we can edit it in live and see how it looks like directly in our content.
This will allow us to adjust our gallery without having to go back to the gallery manager to be able to do it, so we can adjust the gallery and make it fit our content correctly, finally, go and preview the theme in live, we will see how awesome our gallery look like with our post!
Now, as we may know as a WordPress content manager, it is good to change how things look like time to time, and what is the best way to do this?
The answer is using another theme but it could be tedious to go to the gallery manager and then go back to the post to check how it looks like, well, actually, no worries about this! As we showed before, there are settings directly in the page editor.
These settings include, of course, changing the theme, awesome! Isn't it?
We will be able to switch the theme and adjust it when we want to quickly adjust and update things.
The best galleries using the best plugin!
Create galleries from Media Folders
As a bonus, we will see how to create galleries based on folders created using the plugin with the option to automatically add images to the gallery when these are added to the media folder in a few quick steps!
If you go to the media library after installing WP Media Folder, you will see that now there are new options like creating media folders, this is very useful when we want to organize our media library, there are multiple filters and options that will make our media library, the perfect media manager.
In order to create a gallery from these media folders, go to Media Library > Media Folder Galleries, here, hover the mouse over +Add New Gallery, and finally, click on Quick Gallery from folder.
A popup will open, we will be able to select the media folder that we want to use to create the gallery.
Select the folder and click on create.
The gallery will appear on the left tab with the folder that we did select converted to a gallery so it's done! We have a gallery in less than 10 seconds.
Now in order to automatically add the images to the gallery when these are added to the folder, all we need to do is click on the Auto-add image in folder option at the right top of the general settings for the gallery.
This will do everything for us, a tedious work of adding images, done automatically, really awesome! isn't it?
Calling all webmasters!
Save time and boost productivity with WP Media Folder. Effortlessly organize client media
files, create custom
galleries, and provide a seamless user experience.
Upgrade your website projects now!
Start creating the best galleries in the fastest way
Let's end this post in the best way possible, showing a step by step video:
As you can see this is one of the best tools when talking about creating galleries but that's not the only thing that we can do, we can order our images, offload them, connect our media library with cloud services like Google Drive, OneDrive, and Dropbox so what are you waiting for? Go here and learn more.
When you subscribe to the blog, we will send you an e-mail when there are new updates on the site so you wouldn't miss them.
Comments