Make a WordPress Gallery

February 22, 2014| Sushil Adhikari

WordPress has its own gallery shortcode that generates a gallery for your post or pages… Even adding on into a text widget is possible. Styling is usually provided from the default WP theme such as Twenty Thirteen, Twenty Fourteen, and others that may be available. Flat Responsive uses the default gallery styling as a foundation, but with a little enhancement of design to give you a little more for your gallery.

Preparing Your Photos

First thing you want to do is prepare your images that will be included in your gallery. We’re one to always stress consistency with image sizes, but you do not have to have each photo the same size. We should also mention that with a previous tutorial, we mentioned about clearing your Media Settings (thumbnail sizes) and recommended you create your own sizes as you need them. If you do not have the capability to crop and size your photos, you can set your thumbnail media setting to be something you want WP to crop your photos as you upload them, even if your photos are different sizes. 

Note: This tutorial will be based on each image being 800 x 355, so when the gallery is created, the thumbnails will be close to the 255 x 170 in size to the demo.

  1. Prepare your images and get them ready for uploading
  2. Create a page or post where your gallery will be placed. If you are adding it to an existing page or post, open it in the editor.
  3. Put your mouse cursor where you will be inserting the gallery
  4. Click on the “Add Media” button above the editor
  5. Click on the “Create Gallery” link in the upper left corner and then click the Upload Files tab
    create-gallery-upload
  6. In the lower corner, click on “Create a New Gallery
  7. On Gallery Settings, select Attachment page and set it to 4 columns
    gallery-settings
  8. Click Insert Gallery
  9. Switch your editor to the “Text” view and on the gallery shortcode, add this: size=”medium” so that your thumbnails will be bigger than the default small size.
  10. Publish or Update your page.

Screencast Tutorial

Categories: Setup Tutorials for Flat Responsive

Leave a Reply

Black Friday Offer - 50% Off Discount on ALL PRO THEMES AND MEMBERSHIPS Use discount code BFCM2019