#4: Uploading Photos & Creating a Gallery

Photos are essential to building a successful farm website. The images you display will allow customers to make an instant connection to the food that you are growing, animals you are raising, and products that you are selling. The Control Panel has a simple way to store and organize your photos so that they can be easily accessed and added to the pages of your website. This tool is called the Gallery.

This article will review the following Gallery tasks:

 Uploading Photos into the Gallery
 Managing Your Photo Gallery:
       Writing a Caption
       Adding a Tag
       Selecting Public Gallery Photos
       Deleting a Photo

Get Started!

To navigate to the Gallery in the Control Panel go to the sidebar and follow this path:

   Create Content > Gallery

You will see a few options to choose from. Let's start with "Upload Photos".

Note: If you are reading this as a Member Assembler only customer, you will have a gallery section to upload photos for your signup process and e-commerce. To navigate to the Photo Gallery, go to:

   Display > Template Settings > Photo Gallery

Note: Don't have any photos of your farm yet? Read this About.com guide: Taking Great Pictures for Websites for some photography tips and tricks. Once you have taken some photos and downloaded them to your computer, return to this article to continue.

There are two ways in which you can upload photos to the Gallery: the "Advanced Uploader" and the "Basic Uploader." See below for a screenshot of each one:

  Figure 1. Advanced Uploader

  Figure 2. Basic Uploader

The Advanced Uploader allows you to upload multiple images at one time. It also resizes the images for you automatically. The Basic Uploader*can be used if the Advanced Uploader isn't functioning on your browser or if you prefer it.

Using the Advanced Uploader

To use the Advanced Uploader click on the Add button and browse your files to find the photo you would like to upload. Select the photo and a thumbnail image (a reduced size version of your photo) will appear in the Advanced Uploader box. See below:

  Fig.3 Imported Photos in the Advanced Uploader

You can continue to add photos into the upload box by using the Add button until all of your photos are in the upload box. Remember: You can always add more photos at any time in the future.

Another feature of the Advanced Uploader is the ability to rotate your images before you upload them. If your image appears to be on it's side, or upside down, use the arrows on the bottom right and left of your image to rotate it until they are right-side up.

Once you have imported all of your images into the upload box, click the Prepare for Upload button. This tool resizes the images to an appropriate size for displaying on your website. Photos taken with digital cameras are of very high, which is great for enlarging photos or printing photos out to display them. However, these high quality photos are not suited for the Internet.

High quality images have a lot of little pixels that make up the whole image. The more pixels an image has, the larger the image file will be. The larger the image file is, the longer it takes for the image to load. Loading these large images can slow down your website. Sometimes the image will not load at all and there will be a blank box in place of your image. Photos displayed on the internet can have smaller in file sizes, since they don't need to have as many pixels as an image you would print out and display on your wall. Again, the Advanced Uploader will resize the image appropriately for your website.

Once the images have been prepared, you’ll notice that the Prepare for Upload button has changed to a button just saying Upload. Click this new button to upload your newly resized images. Once uploading is finished, you will be redirected into the Gallery Manager. This is where you will can make further adjustments to your photos. (see Managing Your Photo Gallery)

Using the Basic Uploader

The Basic Uploader (See Figure 2.) is similar to the Advanced Uploader. However, with this tool, you must upload your images one at a time and your images will not be automatically resized for you. The Basic Uploader can be found in Control Panel in the same place as the Advanced Uploader by following this path:

   Create Content > Gallery > Upload Photos

From there, click the highlighted link to be taken to the Basic Uploader. Use the Browse button to search your computer for your images and then open the photo you wish to upload. While you are uploading you may write a caption, add a tag, or insert into the Public Gallery. You can also choose to do this later in the "Manage Photos" section. Click the Upload button when you are finished. You will then see a confirmation message indicating that your photo has been uploaded. See below:

  Figure 4. Photo Upload Confirmation Message

You can continue to upload more photos in the Basic Uploader or you can follow the "Manage Gallery" link in the confirmation message to make further adjustments to the images in your Gallery.

Once your photos are uploaded, you can manage photo properties by navigating to:

   Create Content > Gallery > Manage Gallery

This is where you can write captions, add tags, choose photos for your public gallery, and delete unwanted images. See below:

  Figure 5. Uploaded Photos in Gallery Manager

Writing a caption for each photo is a helpful way to add more information to your images. The caption you write will be displayed when a customer looks at your photos. It will also appear in place of a photo that hasn't loaded properly, in the event of a browser issue, or slow connectivity to the internet. A caption is not required, but it is recommended to create context for your images and so that online search engines can find the photos which will bring people to your site. Go to Gallery Manager and type your captions into the captions text boxes next to each photo. (See Figure 5)
Don't forget to Submit Changes at the bottom of the page when you are finished!

Adding tags to your photos serves to create groups of similar images that can be viewed by customers later. You can use multiple tags for each photo so that the image will show up in more than one grouping. Go to Gallery Manager and type your tags into the tag text boxes next to each photo. Separate each tag with a comma. (See Figure 5.) Tagging photos create a database of your photos that customers can search through easily by topic. In the above example, if a customer would like to search for photos from the Farmers Market, both of these photos will appear. Don't forget to Submit Changes at the bottom of the page when you are finished!

Selecting Public Gallery Photos:
Once photos are uploaded, they become available to you to use in different areas and pages in your website. For example, you can insert photos into a "Farmer Defined Page" (for more on this read the article Creating a New Farmer Defined Page or add shots of products you sell to your store page. Your website also includes a "Public Gallery" in it's menu toolbar which you can fill with images for customers to view and search through. Here is an example of a Gallery on a Small Farm Central Website:

  Figure 6. Public Gallery on a Small Farm Central Website

The photos you upload will automatically be added to your Public Gallery. However, you may not want to include all of your uploaded images in this section of your website. For example, you may not want to show the pictures of the products that you uploaded to add to your store, or the headshots that you uploaded and included in your Farmer Defined Page about staff members. It is easy to exclude certain images from appearing in your Public Gallery. Go to Gallery Manager and simply uncheck the box in the column labeled "In Gallery". See below:

  Figure 7. Photo Not Selected for Public Gallery

The unchecked image will not show up in my online Gallery. (See Figure 6.)

Unless you have a specific reason to hide this photo from the Gallery, leave this box checked. Remember, even if you exclude an image from this section of your website, the photo will still be grouped with tags, and still be displayed if you have inserted it into another page or section.
Don't forget to Submit Changes at the bottom of the page when you are finished!

Note: You can remove the Gallery page on your website by disabling it in the Menu Manager. To learn more about the Menu Manager and disabling website pages, read: Managing Menus.

Deleting a Photo:
To remove a photo from your Gallery, go to the Gallery Manager and simply check the box in the "Delete" column. Then click Submit Changes and the photo will be removed from your list.

Ready to move on? Click on another article below: