Index / Menu Pages - Part 2

Once you have your images cropped, resized and saved, go to Step 3, your web page editor. Create a new page if required and select the recommended blank layout. Give your page a title and underneath, using a smaller typeface, add an instruction line such as: “Please click the images below to view the full product ranges available. Thank you.”

Then tab down to a clear line and click the Blue Insert Table icon on your editor icon bar.

Select the number of rows and columns you need. You’ll need 3 times the number of rows, as you’ll need one for the images, one for each group title to appear under each image and a third row to provide a nice gap between each. As far as columns are concerned, two works well as this will allow for the images to be a good size, while allowing good space around them so creating a nice cleanly designed page. Leave the Table Border setting as “0”, Set with table width at 90-95% and click add to website.

Place your Cursor in the first cell – top left, and click the Red Insert Image icon. Browse and upload your image. Select “Centre” alignment, as recommended whenever you place an image in a table cell. If the background of your website is white and your image is set on a white background, leave the border option as “None”. If your image is on a coloured background – select a thin border. Select and upload your next image into the top right cell. Now your table should have resized itself to accommodate your images making it easier for you to add the rest.

Now go down to the next row and in the cell underneath your first image, type a short but descriptive title for the group depicted by the image. If you can keep it to single words – great! Next, enter the title for the second image. Centre align the images and titles using the centre align button in the editor icon bar. They should all line up nicely. You could also choose a typeface, font size and colour for the titles but make sure you do this for them all.

Leaving a gap row before the next row of images, go through your table and place all the necessary images and titles for your groups.

Now, going back to the first image – highlight the image and click the Yellow Insert Link Icon and select Webpage > Internal Webpage > Group > select the correct group from the drop down menu. If you wish to link to an individual product, select Item at this stage. You can set the same link from the titles aswell if you wish. Once you have done all your links, click Save at the top of your page and see how it looks.

You need to decide whether you want the button for your new index page to appear within the Primary Page Menu buttons on the left or top of your website. For the sake of an interesting and enticing home page and also to help reduce the Primary Menu Bar, your Index Page can be hidden. In place of a normal page button, a clear and visible link or button image can be placed within the content of your home page to allow visitors to navigate to the Index Page direct from your Home Page. You can of course do both but remember – it’s not ideal to have too many page buttons in the Primary Menu. You can create and place either a simple line of text or create your own button image using Picasa. Then simply create a link from your text / image to your new index page. Yellow Insert Link > Webpage > Internal Webpage > Select page from drop down. To see how to hide your page from the Primary Menu Bar, see the Blog on Organising your Webpages.

Find out more about us

We have been in business since 2003. Back when the founders of Facebook were still in college, we were writing code and helping our users create great websites.

Affordable business website design

If you need help, why not check out our huge selection of videos, step-by-step guides and knowledge papers.

UKs most trusted

We have helped many thousands of our customers create great looking websites. Take a look at a few examples, created using our website builder.