Photo Galleries

 

1-Column Gallery

In this example, the gallery only has one image, but more images can be added. All of the images would span the full width, so the images need to be wide enough to do so.

2-Column Gallery | Same Aspect Ratio

In this example, the image on the right is actually more than twice the size of the one on the left. They display the same here because their aspect ratio is the same. In this instance, both images are square.

3-Column Gallery | Same Aspect Ratio

In this example,  The images are different sizes, but have the same aspect ratio, so they display the same size in the gallery.

Books arranged in rainbow color order
Globe, pencils, apple and ABC blocks on a stack of books
Apple, eyeglasses, and pencil sitting on an open book

4-Column Gallery | Same Aspect Ratio

In this example,  The images are different sizes, but have the same aspect ratio, so they display the same size in the gallery.

Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
Back to School written on a chalkboard with a variety of school supplies
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side
Books lined up on a shelf

5-Column Gallery | Same Aspect Ratio

In this example,  The images are different sizes, but have the same aspect ratio, so they display the same size in the gallery.

Books arranged in rainbow color order
Books lined up on a shelf
Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
Globe, pencils, apple and ABC blocks on a stack of books
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side

10-Column Gallery | Limited use

Galleries can have between 1 to 10 columns. In a 10-column gallery however, the images will be small and difficult to see, but may have value for some applications. Even if the gallery is set to 10 columns, it can have fewer or more images.

Education written on the chalkboard with an open book in front
Apple, magnifying glass and books on a table in front of a chalkboard with math equations written on it
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side
Hanging light bulbs with a drawing of one to stand out from the rest
Montage of young child with an open book, surrounded by images implicating a variety of things that can be learned from books
Books arranged in rainbow color order

3-Column Gallery | Mixed Aspect Ratio

The six images in this 3-column gallery have different aspect ratios. The module places the images automatically to the best fit possible.

Apple, eyeglasses, and pencil sitting on an open book

4-Column Gallery | Mixed Aspect Ratio

The twelve images in this 4-column gallery have different aspect ratios. The module places the images automatically to the best fit possible.

Montage of young child with an open book, surrounded by images implicating a variety of things that can be learned from books
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side
E-Learning
Hanging light bulbs with a drawing of one to stand out from the rest
Education written on the chalkboard with an open book in front
Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
School supplies with a clock and 2 + 2 = 4 written on the wall
Apple, eyeglasses, and pencil sitting on an open book
Globe, pencils, apple and ABC blocks on a stack of books
Books arranged in rainbow color order
Books arranged in a decorative manner

5-Column Gallery | Mixed Aspect Ratio

The 10 images in this 5-column gallery have different aspect ratios. The module places the images automatically to the best fit possible.

Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
Hanging light bulbs with a drawing of one to stand out from the rest
School supplies with a clock and 2 + 2 = 4 written on the wall
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side

2-Galleries Combined

The first gallery is a 1-column gallery and only has one image. The second gallery is a 3-column gallery with four images, all with different aspect ratios.

Apple, eyeglasses, and pencil sitting on an open book
Hanging light bulbs with a drawing of one to stand out from the rest

3 Galleries Combined

The first gallery is a 1-column gallery and only has one image. The second gallery is a 4-column gallery with all four images having the same aspect ratio so that it will align propery with the third gallery. The third gallery is a 2-column gallery with two images of different aspect ratios.

Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side
School supplies with a clock and 2 + 2 = 4 written on the wall
Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
Globe, pencils, apple and ABC blocks on a stack of books
Montage of young child with an open book, surrounded by images implicating a variety of things that can be learned from books

2 Galleries Combined with added CSS

By default, the galleries are set to align at the top. The first gallery in this example has the three top images, has been given a ‘class’ and simple css to override the default so that they align at the bottom of the gallery. Since the positioning of the images is controlled with JavaScript, only one row can be adjusted to align at the bottom of the gallery in this manner. Attempting to have multiple rows will result in the images overlapping, because they will all sit at the bottom of the gallery.  The second gallery in this example contains the remaining six images and aligns in the usual manner.

Books arranged in rainbow color order
E-Learning
Hanging light bulbs with a drawing of one to stand out from the rest
Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
Montage of young child with an open book, surrounded by images implicating a variety of things that can be learned from books

4 Galleries Combined with added CSS

By default, the galleries are set to align at the top. The first gallery in this example has the five top images, has been given a ‘class’ and simple css to override the default so that they align at the bottom of the gallery. Since the positioning of the images is controlled with JavaScript, only one row can be adjusted to align at the bottom of the gallery in this manner. Attempting to have multiple rows will result in the images overlapping, because they will all sit at the bottom of the gallery.

The second gallery is a 1-column gallery with one image. The third gallery is a 3-column gallery with only three images that have the same aspect ratio, so that it will align properly with the fourth gallery. The fourth gallery is a 4-column gallery and contains the remaining  images and aligns in the usual manner.

Hanging light bulbs with a drawing of one to stand out from the rest
Eyeglasses sitting on an open book in front of a chalkboard with a large variety of education related details
School supplies with a clock and 2 + 2 = 4 written on the wall
Globe, pencils, apple and ABC blocks on a stack of books
Small jar labeled Education, filled with quarters, and a graduation cap on top, plus stacks of quarters off to the side
Montage of young child with an open book, surrounded by images implicating a variety of things that can be learned from books
Books arranged in a decorative manner