PHPMatters Help You Better Hosting Your PHP-based Sites
How to Create WordPress Photo Gallery for Image Display

How to Create WordPress Photo Gallery for Image Display

Are you interested in photography and are thinking of showcasing this passion on your blog site? Are you wishing to present your commodities in a vivid way on the online store? Are you looking to add more content diversities to better attract your website readers? In these situations, creating a special gallery is a great idea, with which you can display all your quality and eye-catching images in a clean and well-organized manner.

If you have no idea of how to start, we have listed the essential steps for the creation of WordPress photo gallery in the following.

Create the Photo Gallery Using WordPress Default Feature

When it comes to showcasing the pictures in a professional looking with the grid-like gallery, most of your might start searching for the gallery plugin. In fact, the truth is that you do not need to do so, but can leverage the power of the default WordPress gallery feature that many people do not know. Check the below steps of how to use this special function.

Step 1 – Create a Special Webpage for the Photo Gallery

The first thing you need to do is to create a new webpage for the display of your photo gallery. You can name it as “Photo Gallery” or anything you like. After that, you need to click the Add Media button the editing page.

Add Media

Next, WordPress will open the media uploader that contains 4 options of Insert Media, Create Gallery, Featured Image and Insert from URL. Here, you need to choose the Create Gallery link.

Create Gallery Link

Now, you can add your preferred images into this gallery by uploading from your local desktop or by choosing from your media library. Then, you simply need to click the Create a New Gallery button. Note that in the bottom of the screen, you can know how many images you have selected and can clear them in one click of button.

Create a New Gallery Button

Step 2 – Edit Your Photo Gallery

The next step is to edit your photo gallery to have it displayed in the way you like. Here, you need to do 5 things as listed as below.

  • Decide the Display Order – Here, you can reverse the display order totally or order these images randomly. Even, you can drag and drop them in any order you want.
  • Link To – Here, you can link this galley to the Attachment Page or the Media File.
  • Columns – You need to decide the columns of the gallery for the proper image showcase.
  • Size – You should choose the image size among the options of Thumbnail, Medium, Large and Full Size.
  • Image Caption – If you want to present the detailed information about your images, you can caption these images in the below of each one.

As everything is configured properly, you can click the Inset Gallery button. Then, the media uploader will be closed and there is a line of gallery code appeared inside your editing page.

Edit Your Photo Gallery

Step 3 – Check Your Photo Gallery and Make Some Modifications

Now, you can click the Preview button to check how this gallery looks. If you are not satisfied with the overall display, you can click the Add Media again to edit the gallery until you are happy with the way it appears.

Then, you can publish this webpage and add it to your navigation bar from the Menu settings of WordPress admin.

Customize the Display of Photo Gallery

If you are tired of the grid looking, you can customize the display of your photo gallery and showcase these images in the carousel or the masonry manner. If you are not good at the CSS coding stuff, you need a WordPress plugin to help you achieve this. Here, we suggest you to try the Simple Photo Gallery plugin.

After installing this gallery plugin, you firstly need to configure its settings from the newly-added Photo Gallery tab. In this page, there are two things for you to decide.

  • Sort the order of the gallery by image ID, date and name.
  • Choose the webpage to display the gallery. You can create one on your own or pick the default Galleries page created by this plugin automatically.

Simple Gallery Settings

Now, you can click the Create New Gallery button to add the photo gallery. To begin with, you should give this gallery a name and decide the template among 3 options.

  • Template 1 – This template displays your gallery in a grid manner and each image is showcased with the thumbnail size of 150×150.
  • Template 2 – This template also displays a gird-like gallery, but the image is coming with the true portrait proportions.
  • Template 3 – This option results in the photo gallery with the masonry style.

If you haven’t decided the display order previously, you also need to determine the sort order for the photos. Besides, we highly recommend you to check the box that enables the preview function, so that you can modify your gallery timely.

Gallery Settings

If you want to protect the intellectual property of your images, you can add the watermark on each of them. Here, you can decide the watermark text, text opacity, text placement, font size and the max dimension size for the preview.

Watermark Settings

If you upload a large number of images for your gallery, it is recommended to turn on the pagination function and to decide the exact images to be displayed for each webpage.

Now, you can upload your preferred images and click the Save Gallery button.

Create a Masonry Photo Gallery

To get the masonry style, you simply need to choose the Template 3 for your gallery, and enter the shortcode of [wppg_photo_gallery id=”1″] to the gallery webpage. Note that the id parameter refers to the ID number of your gallery. You can find the number from the Existing Galleries section. The final results look like the below sample.

Masonry Photo Gallery

Create a Slider for Photo Gallery with Carousel

If you are looking to create a slider for your gallery, the required shortcode is [wppg_photo_slider id=”1″]. Even, you can add the carousel for the slider with the parameter of show_carousel=”1”.

Carousel Galleries

Create the Albums to Display Multiple Galleries

If you have more than one gallery and want to categorize them for display, you can use the album function offered by this plugin.

Here, you firstly need to create multiple galleries to showcase your images with different niches. Then, click the Create New Album button.

In the next page, you are required to enter the album name, choose a special thumbnail image to represent this album, sort the order for each gallery and select from the available galleries you have created previously.

Album Settings

After clicking the Save Album button, you now need to create a new webpage to showcase this album, and add it to your website navigation. Note that this page needs to include the shortcode of [wppg_photo_albums_home].