How to Create a Responsive Image Gallery on your WordPress Blog

Using images is key to any blog, and the best way to showcase your images is with a Responsive Image Gallery.

Images – photos, graphics and the like – add visual appeal to your WordPress blog. This gets you a better response and return traffic. But you need to display them properly by using way to an image gallery.

Why use a Responsive Image Gallery?

Are all of your images the same size? Probably not. Do you want to spend hours cropping and resizing your photos? Definitely not. Then a Responsive Image Gallery is the best solution.

A responsive lightbox adjusts according to the size of your image. In other words, it expands or shrinks to fit the image. A Responsive Image Gallery adjusts according to every picture in the gallery.

How to create a Responsive Image Gallery

With FooGallery, setting up your gallery in your WordPress blog is simple. Here are the steps you’ll need to follow:

Install FooGallery

If you haven’t already added the FooGallery Plugin, do this now. Go to your Dashboard, and select Plugins – Add new. Search for FooGallery, Install and Activate.

Create a gallery

Once FooGallery is installed, it will appear in your Dashboard’s menu, and will be visible on your left when adding a post. Select Add Gallery. You’ll then be directed to a page where you can add a title and your images. You’ll also see the various gallery settings on this page.

Select media

Choose the images you want to add. Click on Add Media and the Upload Files (or choose from existing images).

Add image titles

As each image is added, you’ll see an option on your right hand side to add titles, captions, alt text and descriptions. Fill these in, as they help categorise your images and improve your SEO.

Drag and drop

You’ll also be able to reorder your images here. This is useful if you’re providing step-by-step instructions or simply want your images to appear in a particular order.

Select your template

You can now work on the appearance of your gallery. The first setting you need to select is your gallery template. Select the Responsive Image Gallery.

If you want to try a different template, there are several to choose from. If you decide later on that you’d prefer a different template, you can always change both your template and settings.

Choose your settings

The settings allow you to change the appearance of your thumbnails, the hover affect and things like the display of captions. You can adjust these to suit that particular gallery or the overall theme of your site.

Add the gallery to your blog

Once you are happy with the appearance, you can add your Responsive Image Gallery to your post. You can do this by copying the gallery shortcode into your page. The shortcode appears in the gallery, in the right hand menu, just below your publishing options. Or you can find it on the Galleries page.

Publish it

You can now publish your post or page and see the gallery in action.

Using a Responsive Image Gallery really is a very effective way to display your images. Get FooGallery now, or check out the gallery template demos.

1 thought on “How to Create a Responsive Image Gallery on your WordPress Blog”

Leave a Comment

How to Create a Responsive Image Gallery on your WordPress Blog