MenuMachine 2 Features

MenuMachine 2 allows you to create dynamic navigation menus for your GoLive sites.

Workflow and screenshots | Example menus

GoLive Integration

GoLive has fantastic site-management features and because MenuMachine 2 is is an extension of GoLive, it can take advantage of the best of those features to help make creating dynamic menus easy and fun.

Tight integration with GoLive

MenuMachine is built GoLive and supports GoLive CS, CS2 and GoLive 9. Its user interface integrates seamlessly with the GoLive palette and window workspace you are already familiar with.

Automatic Link Management

Because MenuMachine 2 can take advantage of GoLive's link management system, you don't need to use absolute links in your menus. Link to pages and images etc. in your site using the pick-whip or browse button and let Golive take care of the rest. You can move pages between folders in your site and GoLive will automatically adjust any links that need to be changed.

Site-wide updating

Navigation systems are generally found on most of, if not all of the pages in a site. You don't want to re-upload all your pages every time you make a change to your menus. With MenuMachine 2 you don't have to.

MenuMachine 2 menus can be placed on any page in your site. Making changes to that menu in the MenuMachine 2 Editor won't change the page! You only need to upload the menu support files if you make a change to a menu. Now that's going to save time!

Menus can trigger GoLive Actions

A menu placed on a page can trigger GoLive Actions on the page using three trigger events: Mouse over, Mouse click and Mouse exit. You can attach an action (or action group) to any events of any item in the menu. Menus on different pages can trigger different actions.

Menus in GoLive Templates or Components

While you can use components and templates with MenuMachine 2, it may not be required if updating your navigation system site-wide was the only reason for using them.

By default, when you update a menu in MenuMachine 2 it automatically updates on every page in the site that contains that menu but the page code doesn't change! Only the menu support files need to be re-uploaded to the server for the entire site to be updated. This makes site-wide menu updates extremely quick and easy.

Formatting Features

Amazing WYSIWYG menu editing interface

You don't have to edit a single line of code. The MenuMachine 2 Editor allows you to see your menu as you edit it. See screenshots here.

Themes

MenuMachine 2 introduces Themes. All menus are based on a theme which is a pre-built menu which already has settings applied. For example, if you want to build a horizontal menu with horizontal submenus, pick a theme which has this setup and start editing.

Although most themes have colors, fonts and in some cases images already applied, you can still edit everything to completely customize your menu for your site.

You can save your own themes so you can use the same type of menu in multiple sites saving you a huge amount of time! Some example themes are supplied with MenuMachine. More will be available from this site soon.

Item-Level Control

Edit the smallest detail at the item level.

You now have control over these settings for each individual item in your menu and for its different states:

• Item Text (in normal and over states)
• Link and Target
• Background Color (in normal, over and click states)
• Background Images (in normal, over and click states)
• Border Color, Width and Style (in normal, over and click states)
• Font Set (GoLive's sets or your own custom sets)
• Font Size, Style and Decoration (in normal, over and click states)
• Text Alignment and Padding horizontal and vertical (in normal, over and click states)
• Icon Image and offset in item (in normal, over and click states)
• Tooltip text
• Status Text
• Over Text

Block-Level Control

Another level of settings can be applied to blocks of items. A block is a group of menu items which are grouped together in the menu structure e.g. the top-level of the menu is a block, a group of items in a submenu is a block.

Block settings allow you to further enhance the menus beyond editing individual items. For example, you may want the whole block to have a background image, color and border in addtion to its items' colors, borders and images. Block settings do not alter the individual item settings within the block.

The following settings can be applied on a block-by-block basis:

• Orientation
  You can choose what orientation each block of items will have. You can have any combination of horizontal and vertical blocks of items e.g. horizontal top-level block with vertical submenus, horizontal top with horizontal submenus, vertical top-level with vertical submenus.
• Block Offset
  You can visually adjust the offset of every block of submenus by dragging or nudging it into position. You may want your submenus to slightly overlap their parent item, or to be placed away from it.
   
  This feature makes creation of horizontal submenus a breeze. Because submenu blocks are all different sizes, you would probably want to align each submenu block differently relative to its parent item to get a pleasing visual effect. This can be done easily with MenuMachine 2.
• Padding around items
  This adds padding around each item in a block of items.
• Padding between items
  This adds padding between each item in a block of items.
• Block Background Color
  If the menu items in a block are transparent, you can see the block background color through them. You can also see the block background around and between the items if you use padding.
• Block Background Image
  The whole block can have a single background image. You can make this image scale to fit the block or crop it to the block size.
• Border color, width and style
  The block's border is seen surrounding all the items in the block. This does not obscure or affect each individual item's border.
• Separators
  These are colored lines or images which are placed automatically between each item in a block. You can adjust the color, thickness and inset of colored line separators.
• Opacity
  Adjust the opacity of the whole block so you can see the page background through the block. (Requires a browser which supports variable opacity otherwise 100% opacity is seen.)
• Arrows
  These are images placed in the menu items to indicate that the item has a submenu. You can choose any image to be the arrows for a block. MenuMachine 2 will automatically place the image in every item in that block which has a submenu. Different arrow images can be chosen for the normal, over and click states. You can adjust the horizontal and vertical offset of the arrow images.
• Effects
  These are animated submenu opening and closing effects. You can choose different effects for the open and close event for each block.
  Choose from: Fade only, Zoom, Slide, Bounce, Slide with Overshoot, Jump In, Jump Out, Switch On, Switch Off.

Icon and Arrow Gallery

The MenuMachine 2 Icon Gallery is a built-in gallery of images, some of which have been designed to allow on-the-fly color selection.

When you are selecting arrows or icons for your menu items, you can open the Gallery and select an image. You can see this image displayed over the background color of the item your are editing. You can (for the right type of image) change the color of the image by using a color well. This dynamically generates the colored image and saves it into your site.

Many icons and arrows are supplied with MenuMachine 2. You can add your own custom icons to the Gallery. More images will be available on this site soon.

Copy Formatting tools

Menu creation is quick and simple when you use the format copying tools. With so many settings available for each individual item and block, you need to be able to quickly copy and paste formatting from one item to another.

This feature of MenuMachine 2 gives you amazing control over the settings you want to copy between items. Just select an item that you have edited and use the Copy Formatting button. Select another item or a block and use the Paste Formatting button. You will be presented with a list of the items you want to copy and a list of items in the menu you can copy the formatting to. Make your selections and hit OK.

Copy formatting will save you a huge amount of time applying general look and feel settings, while still giving you the freedom to make minute adjustments to individual items.

Moving items within the menu structure

Sometimes you (or your client) want to make changes to the menu structure after the menu has been created.

With MenuMachine 2 you can easily move items within their existing block using the Move button in the Menu Editor.

In addition to this, you can also move items to a whole new location in the menu structure! For example, you may want to move a top-level item (and its submenus) to a different level in the menu structure. This can now be done easily with the Relocate button in the Menu Editor.

Types of Menus

MenuMachine 2 lets you create menus to fit in any web page.

Cascading menus

Cascading menus are the popular type of drop-down menus that MenuMachine 1 customers are familiar with. Cascading menus have submenu blocks which appear outside of the parent item's block. When submenus open they "float" above the other page content.

Vertically Expanding Menus

A new type of menu has been added to MenuMachine 2 after many requests from customers. Vertically expanding menus allow the submenu block to be revealed inside the parent item's block. The top-level block opens to reveal the submenu block.

This type of menu is great for a narrow vertical column in your page design because the menu doesn't require extra width in order to be able to show the submenus.

Horizontal submenus

Now you can make your menus have horizontal submenus and really have them align where you want them!

You have total control over the position of each submenu block which is very important when creating a horizontal menu. Not all submenu blocks are the same size so they individually need to be positioned. You can do this with MenuMachine 2.

This type of menu is great for a narrow horizontal space in your page design because it doesn't need much extra depth in order to be able to show the submenus.

Ditch those frames

The ability to create vertically expanding menus and horizontal submenus will allow you to more easily create menus without needing to worry about using frames in most situations. You can make your menu fit small spaces like never before!

Placing and Positioning menus

Place your menus anywhere on the page

You can place your menus inside tables or layers and use your favorite positioning techniques. It's as easy as placing an image on the page!

Menus don't affect other objects on the page

When you place a menu inside a container (such as a table cell or a layer), it won't change the shape of that container when the submenus are revelead. You don't have to worry about your layout "breaking" when the menu is activated. The opened submenus will simply "float" above the other page content and not alter your layout.

See your menu on the page in Layout view

You can see a preview of your actual menu right on the page in Layout view. The menu is presented as you would first see it in the browser, without the submenus opened. This lets you position the menu with confidence!

Multiple menus per page

Place multiple menus on the same page. Place the same menu multiple times on the same page!

Browser Behavior

Menu Highlighting

When you visit a page which is linked to by your menu, you may want the menu to automatically show highlighting to indicate which page you are on. You can choose from a number of options, showing the over or click states of items at various levels in the menu.

Hide form elements

You may have noticed that some browsers "push" form elements forward interfering with DHTML menus. The Hide form elements setting in MenuMachine 2 allows you to automatically hide form elements when a submenu is displayed.

Relative sizing in browsers

Some browsers allow you to resize the text on a viewed page. MenuMachine 2 has a setting which allows the menu to reduce/enlarge if the site vistior changes their browser viewing size.

Automatic menu map

This is a site map generated by using the links in your navigation menu. You can customise the look of the menu map to suit your site.

Alternative navigation for non-JavaScript browsers

For browsers which don't have JavaScript or have it disabled, you can tell MenuMachine to automatically link to your menu map page.

Alternatively, if you want something else to display in non-JavaScript browsers, you can insert your own custom code which will appear in place of the menu if JavaScript is not enabled.