Galleries of Images

Preparing Images

Before you upload images to your site they need to be sized, color-corrected and exported as jpegs. Color correct you image for the screen. In order to fit on most screens using “lightbox” images should have a maximum width of 900px and a maximum height of 600px. Images should be 72dpi and exported as a medium high quality jpeg. Don’t export them at 99% quality. The final image will be between 50KB and 100KB. WordPress will create thumbnails for you.

Both Photoshop and Fireworks offer batch processing, which can automate some of this tedious work.

There are two free online image-editing services that I would recommend if you do not own a good image-editing program. Both of them are easy to use and can do everything you need to creating screen-ready images – resizing, minor color correction and sharpening and exporting as a jpeg.

http://www.pixlr.com/
Go to the site and then click “Image Editor”.

http://www.aviary.com/
Click “Image Editor” icon, then click “Launch Phoenix, start a new creation”. It should be fairly self-explanatory after that.

I recommend that you organize your image files in folders as you want them to appear online so it will be easy to access them as you upload them.

NOTE: You will have better luck if your file names, include the proper extension, jpg, etc and have no white space or unusual characters, e.g. $#^,”” . It is best if the names include only letters, numbers, underscore and dashes.

Adding Images to a Post and Creating a “Gallery”

Steve Lambert’s “WPFolio User’s Manual” also includes instructions on creating galleries.

Click on “Posts” in the left hand menu of WordPress.
Click “New Post”

Make sure you choose the category for the post, in the right hand sidebar.
WPFolio

Add a title for the the group of images being uploaded, e.g. “Recent Sculpture”,
“River Series”, etc.
Click the small image icon above the “post” text box, shown below:

WPFolio

An overlay dialog box appears. Click Select Files
WPFolio

Navigate to the images you wish to upload and select them.
You can select multiple files.

Watch the images as they upload. It will be quick if you have broadband.
Click “Save All Changes” and the screen will refresh in the Gallery tab.

WPFolio

NOTE: I have noticed a glitch. If you are uploading large files or many files at the same time, the gallery tab does not appear. Try uploading one image first. Then repeat the process selecting multiple files from your computer. This method seems to force the software to create a gallery.

Leave the other gallery options, as is.

You may want to change the number of Gallery Columns depending on the layout of your page.
You will return to this screen later to add more information like title, media, size to your images.

Click “Insert Gallery”.

WPFolio

After returning to the post page Click “Publish” on the right side of the page.
Click “View Post” to check the page.
You should see a page with several rows of thumbnails cropped to 150 x 150 pixels.
Click the thumbnails and see the lightbox in action.

Adding the title, media, date and size of each artwork

In the admin section of WordPress return to the post you just created.

There are 2 ways to access your uploaded images.

1) In the text box, click the gallery icon and then click the image icon to edit the gallery (see below).
WPFolio

OR

2) Click the image icon adjacent to “Upload/Insert (see below)

In the overlay dialog box click “show” next to an image.
WPFolio

Add title, media, size and date to “Title”. (As you get to know WordPress, you may want to use the other options. For now, leave them as is.)

Repeat this process with all your images.

Don’t forget to do this or your titles will be lost and you will have to enter them again.

Once you have finished click “Save All Changes”, at the bottom of the list of images.
Because this is a “Gallery”, do not click “Insert into Post”

Exit the dialog box

and click “Update”.

Check your page by clicking “View Post”. The title, etc. only appears in the “lightbox”, not below the thumbnails.

Repeat to create more “galleries”.

Useful Links

Adding Posts – WPFolio User’s Manual

Choosing the featured image

There is now a new, easier, better way to choose the featured thumbnail on a category page.

On the Posts page of the WordPress Dashboard click “Set Featured Image” in the “Featured Image” subpanel in the lower right sidebar.

set featured image wordpress

Then on the “Add an Image” screen, click “Use as Featured Image”.

use as featured image wordpress
Be sure to click ” Save All Changes” before closing dialog box.

The featured image will appear in the lower right of the Edit Posts page. Like this:

featured image wordpress

You can easily remove the image and add another one, if you wish.