Image Handling in WordPress

In today’s Hands-On WordPress meetup we discussed using the media library to upload and handle images.

Nick demonstrated the basics of adding an image using the upload/insert image option in your WordPress post/page editing window. You can modify your image title, add alternate text, add a caption, and then at the bottom you can choose the layout and size options and then finally, insert into the post.

He also demonstrated how you can go to Library under Media that allows you to batch upload a series of images ahead of time.

The media “Library” includes all images/media associated with a site; the “Gallery” is associated with an individual post or page.

You can manage a given gallery (or call one to a specific place) by using a gallery shortcode. This is a small piece of code included within square brackets [ ]. The details of different options available to you, including number of columns, display order, and so forth, can be viewed via the WordPress Codex. Shortcodes are good when you need to repeatedly place a given photo, because once you know the shortcode for an image, you can use it over and over again easily.

In your admin panel under Settings > Media Settings, you can choose the default size for each image setting (thumbnail, small, medium and large), as well as the location/name of the upload folder for your media. You can also choose the option to organize uploads into folders by date.

You can also upload music, video and PDFs using the media library.

Using featured images: how (or if) this is used is entirely theme-dependent. To select one, choose a photo by selecting ‘use as featured image’ in the media uploader. In Twenty-Eleven (the default theme for WordPress 3.2) it will place the featured image in the header image. In other themes it may place that image elsewhere on the page. It will not show up as part of the post itself, however. It will also be the image shown as a thumbnail on social media sites like Facebook.


Plugins:

  • Media Library Categories: allows you to organize your media library contents.
  • NextGEN Gallery: A very popular image plugin that allows you to organize your images into galleries not associated with posts/pages. There are also a number of plugins for NextGEN that add to its functionality by giving different slideshow/display options. One problem with NextGEN is that it creates its own media library and does not utilize the native WordPress media library, meaning you must upload all photos through NextGEN. Sandi points out that it is pretty intuitive and easy to fix mistakes, and easy to reuse images throughout your site. Also has good bulk-action options.
  • More MIME Types: allows you to specify and organize media by different file types. It will then tell the browser how to handle or display the media files.
  • Scissors Continued: expands on the WordPress media library’s functionality by allowing you to crop, rotate and resize images.


Helpful tips:

  • Add photos to media library rather than just cut and paste images into your WordPress window, and you can call up the image to use later. This will also create your thumbnail and other image sizes for additional options and functionality later.
  • Using the plugin Add from Server you can add photos and other media to your WordPress media library that have previously been uploaded via FTP.
  • Always include “alternate text” when uploading photos. This will display to anyone who doesn’t have images turned on in their browser, and will also be available to people who use screen readers to view your site. It also gives you a good boost with SEO.

For an additional resource on images, be sure to review the information provided at the WordPress Codex.

Questions? Tips you’d like to share? Suggestions for other plugins dealing with images? Please add your comments below!


Don’t forget that we have several classes coming up with Hands-On WordPress: adding and managing content; plugins; and backups and Google applications. Go to Hands-On WordPress for more information and how to sign up.

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)