background image

The Pro Gallery Introduction

It is important to understand some basic concepts before starting to work with galleries.

A Gallery is defined as a collection of Photos.
A Portfolio is defined as a collection of Galleries.

You add Photos to a Gallery, you add Galleries to a Portfolio, and you add a Portfolio to a Page.

This method allows you to create groups of related Galleries into a Portfolio, and then add the portfolio to a page. When a visitor views that page they will then see all of the galleries in that portfolio.

Preparing Photos for your Galleries

Remember, most of your website visitors will be using standard laptops with 15" or 17" monitors.

This is very important, especially when you may be using a much larger monitor, and all websites to you will appear small in comparison to most of your visitors and customers.

The maximum height of a photo that can comfortably be viewed on a 17" monitor, without having to scroll, is 700 pixels. This is reduced to 600 pixels for people using a 15" monitor.

This means that the optimum image size for galleries is circa 800 x 600 ppi.

The resolution of photos for websites is between 72 and 96 ppi because this is the maximum resolution that computer monitors can display, therefore, always change the resolution of your photos to 72 or 96 ppi.

If you use PhotoShop then the File / Save for Web facility does this for you (you only need to change the image dimensions).

To keep the filesize down and speed up image display, set the jpeg quality to approx 70%.

If you don't have any batch resizing software you can download excellent free tools such as Irfanview and FastStone Photo Resizer.

File Naming Recommendations

It may be all too easy to just leave your image file names the same as they were created in your camera, but this poses a number of disadvantages.

  • Camera file names (eg: DSC_6543.jpg or IMG_5643.jpg) have no relevance to the subject of the photo, and so they will not be found by Google Image search. It is always best to rename your images with an appropriate keyword that describes the subject of your photo.
  • If you are shooting for a client, it makes sense to rename your images with an abbreviation reference that relates to the client name. This will make it much easier for you to find the image when the client gives you a file name on email. It is also professional practice to associate file names with clients.
  • Websites display files in alpha order, so they will not list them numerically. Therefore, if your images are named IMG_1.jpg, IMG_2.jpg etc, then the website will display IMG_10.jpg after IMG_1.jpg. To ensure correct list ordering you should rename your images using zero padded numbers such as IMG_001.jpg, IMG_002.jpg, IMG_010.jpg etc.

Use batch image processing software such as Irfanview which can rename your files as well as resize them.

Only use alphanumeric characters plus hyphens and underscores in file names.
NEVER use spaces, punctuation or quotation marks or any other non alpha characters.

The Gallery Wizard

Creating and editing galleries are all managed via the Gallery Wizard which is accessed via the Click IT Utilities link under the Start tab in your main admin.

Click IT Utilities link to Gallery Wizard

Gallery Wizard Main Menu

Everything from uploading your photos to creating special offers (eCommerce versions only) are available from this main menu. Click on the Quick Start link to view a guide to uploading your photos and creating an instant gallery.

There are help icons and links everywhere in the wizard which explain what each step does.

Wizard main menu

Follow The Wizard Prompts

Whenever you create a new gallery or portfolio etc, the wizard will always prompt you to complete any required steps, and these prompts will appear at the top of the page highlighted in green. This makes the process of managing your galleries as simple as following the wizard prompts.

You can always get more help by clicking on the help icons and help links that appear everywhere within the wizard management facility.

Pro-Gallery: Tutorial Videos

The following video tutorials will help you setup your galleries and upload photos etc.

Video 1: How to create a web page to display your galleries and how to upload your photos using the wizard image uploader.
Click to view Video 1

Video 2: How to create a Gallery and add photos from the file store, and adding the gallery to the web page created in Video 1.
Click to view Video 2

Video 3: How to change the gallery and thumbnail display styles.
Click to view Video 3

Video 4: How to make your gallery eCommerce by adding a price range.
Click to view Video 4

For tutorial videos on using the page editor click here.