One of the most challenging lessons we teach in our WordPress Intensive workshop is the WordPress Galleries module.
WordPress comes with gallery functionality built-in. You don’t need a separate gallery plugin.
Often WordPress beginners get frustrated with how many clicks it takes to create a default WordPress gallery and they’re concerned that they won’t remember how to do it when they try on their own.
In this tutorial, we walk you through each click step-by-step.
How do I add a Photo Gallery to a page in WordPress?
[clickToTweet tweet=”A step-by-step guide to creating & editing #WordPress image galleries pic.twitter.com/A5AW9eQeTo” quote=”A step-by-step guide to creating & editing WordPress image galleries”]
Understanding the WordPress Media Library
The WordPress Media Library stores your images and other media files such as pdfs and audio files.
The Media Library Screen is typically used to view and delete Media previously uploaded. In the Media Library, there are two views: Grid View and List View.
When You Add an Image or Other Media
Upload and insert media in WordPress content directly from a Page/Post. You don’t need to move away from where you’re working.
How to Create an Image Gallery in WordPress
Follow these 9 steps to create and insert a native gallery in WordPress:
- Create or Edit the page where you want to display the gallery
- Click “Add Media”
- Upload Files.
- Click Create Gallery (top left corner – see screenshot below)
- Select all the images you want in the gallery (tick mark will display)
- Before clicking the “create a new gallery” review the image Attachment Details. Be sure to add Alt Text for every image. Alt text will describe images for Screen Readers and Search Engines alike.
- Now click “create a new gallery” button at the bottom right (see screenshot above).
- On the right side review the Gallery Settings. We suggest changing Link To from Attachment page to Media File, we’ll use this in a moment to create a lightbox effect.
- And now for the moment you’ve been waiting for….. click Insert Gallery
How to Edit a WordPress Photo Gallery
After inserting a gallery, you can return to edit the gallery by clicking on the image gallery in the WordPress visual editor. When you hover over your gallery, you will see a pencil and an x. The x will delete the gallery and the pencil will open the gallery editing screen.
On the Edit Gallery Screen, you can:
- Rearrange your images: Drag and Drop image thumbnails to rearrange the order of images in your gallery.
- Reverse Order: Reverses the order of the images in your gallery.
- Remove images: Hover over a thumbnail and click on the “X” to remove any of the images you previously selected.
- Add more images: Click on the “Add to Gallery” in the left-hand sidebar to add more images to your gallery.
- Links To: Controls whether the gallery thumbnails (on the published page/post) link to the image attachment page or directly to the source image file itself. We suggest linking to the media file.
- Columns: Set the number of columns – how many thumbnails you want to display across the page.
How to turn a WordPress Photo Gallery into a Slideshow
These plugins transform the WordPress native galleries into more functional and attractive galleries.
- Foobox lightbox: Install and activate this plugin. If you changed the Gallery Settings to Link To Media File as we suggested in step 8 above. Then this will work out of the box. When someone clicks on a thumbnail in the page the image will open larger with arrows to navigate between images. NOTE: You may need to clear your browser cache to see the lightbox working.
- If you want to transform your WordPress gallery into a slideshow, we suggest the Soliloquy Slider Plugin with the dynamic and thumbnail addons.
We hope that you found this post helpful. Pin, bookmark or share it so you can return here the next time you need to create or edit a WordPress photo gallery.
To learn more about blocks ….
Join us for a WordPress Intensive with Gutenberg, February 20 & 21, 2020.
Or subscribe here to get our blog posts sent to your inbox.