IAC logo

The world of non-commercial film and A-V

Events Diary Search
The Film and Video Institute find us on facebook Join us on Facebook

 

Menus in Weebly

The Navigation article discusses various menu formats to help visitors navigate around your website. Here are the ways Weebly can help.

Main Menus

The Weebly  themes offer two main menu formats: vertical or horizontal. You can try different themes any time and as often as you like. Your existing Weebly pages will all adopt the changed format.

Horizontal Menus

Sketch layout for a horizonal style menu system.

In this type of layout the Main Menu is the blue line near the top of each page. When you point at an item any Sub-Menu/s appear on the line below it.


Vertical Menus

Sketch layout for a vertical menu system.

In this type of layout the Main Menu is the blue lines on the left - each line is a menu item. When you point at an item any Sub-Menu/s appear to the right of it.

We recommend you use columns to divide up the text. A Vertical Menu immediately starts that approach since it uses a column for the menu. Read more about creating columns in Weebly here.

Fancy divider line.

Sub-Menus

  • Sub-Menu/s (if any) appear when users point their mouse at a Main Menu item.
  • They appear immediately below or to the side of their parent Main Menu item.
  • Sub-Menu items contain information which is less important/urgent than the main items.
  • Sub-Menus can be displayed so that matters of roughly equal importance are grouped together and matters of less importance shown to be subsidiary to them.

Remember that you can try almost any change on Weebly and see what your website would look like that way. Until you click the Publish button it does not alter the public view of it. That makes it safe and easy to experiment.

Defining Sub-Menu items



In Weebly's Pages Tab create a "New Page" and at the "Show in Navigation Menu?" prompt select "Yes". Give it a name.

Drag the new page under the Main Page in the list on the left but do not yet click the Save button.

Drag the new page slightly to the right so that it appears indented. (e.g. the 'See our work' page in the menu on the right.) That defines it as a Sub-Menu which will appear only when visitors point their mouse at the Main Menu item above it. Then click the Save button.

If you then return to the Pages Tab and add another page you can choose:

to drag it to the same degree of indent (defining it as of equal importance) or
even further to the right (defining it as of lesser importance.)


The Weebly Pages Tab showing indented sub-menu items.Here we show the menu part of the Pages Tab ...

Below About Us are four Sub-Menus grouped according to their relative importance.

This helps visitors to the website to choose what to read.



  • The most useful information will be on the Main Menu item.
  • The next most useful info will be on the Sub-Menus at the first level of indent.
  • The third most useful will be on the Sub-Menus at the second level of indent.

Horizontal Menus & Sub-Menus


Vertical Menus & Sub-Menus

What visitors to your website see ...

Sample horizontal menu with one layer of sub-menu.

The > indicates another layer of Sub-Menus is available.


Sample vertical menu with one layer of sub-menu.

The > indicates another layer of Sub-Menus is available.

Pointing at the Club History menu reveals the next Sub-Menus.

Horizontal menu showing two levels of sub-menu.


Pointing at the Club History menu reveals the next Sub-Menus.

Vertical Menu showing two layers of sub-menus.

We have had to shrink the vertical menu images to fit this page, hence they seem less clear. In practice they are perfectly legible.


There are nine pages in this series of detailed Weebly tips:

They support general articles on web design for film-making and AV club websites which begin here.

[Weebly frequently update and improve their system. These pages are based on tests in March 2015.]


Share your passions.

Audience silhouette.

Share your stories.

Page updated on 07 March 2015
Contact Webmaster
find us on facebook Join us on Facebook
Bookmark and Share
UNICA information UNICA member
Company Limited by Guarantee No. 00269085. Registered Charity No. 260467. Authors' views are not necessarily those of the Institute of Amateur Cinematographers. Website hosted by Merula. JavaScripts by JavaScript Source. Menu by Live Web Institute. Art work by Tony Kendle.