How to build a Horizontal Gallery

Is it possible to make a gallery which goes across the screen, rather than down the screen?

Yes indeed, that is possible. You need to use Microsoft Internet Explorer on a PC to build your image gallery in this manner. The end result appears as a grid of thumbnail images and this is what it looks like when you are finished:

Food Gallery

Family Festival

The final result is very stylish and effective and this method of image gallery creation is very popular with creative photographers, artists and illustrators.

Create your own Horizontal Picture Gallery

Firstly, you need to build your own picture gallery in the normal way. When you have done that, please do the following:

1. Open up two browser windows.

2. In one browser, log into your website toolkit at QuickontheNet.com.

3. When you have logged in, go to 'Pages'.

4. Now, click on 'Edit' next to the menu button where you wish to create your horizontal gallery. Please note that you are now editing the page area which sits above your normal gallery.

5. In the other browser, view your website on the internet as a customer would see it and go to the gallery page.

6. With your mouse, 'right click' on the first gallery thumbnail and select 'copy'.

7. Now, go back to 'Pages' in your toolkit using the other browser; move your mouse into the 'Main text' area and 'right click' and then select 'paste'.

8. The thumbnail will appear in the 'Main text' area!

9. With your keyboard, enter 3 letter spaces using the space bar. You are now in the correct position to 'paste' in the next thumbnail. So...

10. Repeat steps 6 to 9 above, using the second thumbnail.

11. Repeat steps 6 to 9 above, using the third thumbnail - and so on.

12. When you have created 5 thumbnail images in a row, press the carriage return key on your keyboard and continue down the page. 'Save' the page when you are finished.


As you would expect from QuickontheNet.com, it's quick and easy.


Tip 1: It is important to preview the results in the site itself and not within the 'Main text' html editor, because the line breaks and image wrapping will be different in the 'Main text' area. In other words, it will be correct when the web page is viewed on your website.

Tip 2: When you have finished building your horizontal format gallery, at the bottom of the 'Page' in the 'Main text' area, add a bunch of line spaces. If you do this, people viewing your website should not know that the grid of thumbnails is sitting above your regular gallery.

Tip 3: If you gallery contains portrait images only, you may wish to create 6 images in a row and repeat 6 images each time down the screen. By the way, using the method outlined above, you can mix and match landscape and portrait images in your horizontal gallery, according to your preference.

To see the results of your new-style gallery, please go to your website and refresh your browser on your gallery page (or press F5 on your keyboard).

This technique is extremely easy and simple, once you have a go and get the hang of it.

Have fun!


Useful Photography Links

Compare Digital Camera Prices ~#~ How to Resize your Photos ~#~ Free Photo Editing Software ~#~ How to Watermark a Photo Image ~#~ How to add Code




Go back...