Apart from the basic menu design approach (which involves AllWebMenus features such as Background Colors, Borders etc.) you can also use a more advanced web menu design approach by incorporating your own images to your projects to enhance them or by simply exporting them as themes.

When you install AllWebMenus Web Menu Builder, you will notice a range of existing pre-installed themes, which can be used to improve the appearance of the menus. However, AllWebMenus themes stored in the "Theme Gallery" directory (C:/Program Files/AllWebMenus5/Theme Gallery) have only one color version available.

If you plan to use a different color scheme or make changes to the shape of a button, you will need to manually change the theme images.

In this guide, we will show you how a menu is constructed using AllWebMenus and, of course, an image editor (i.e. Adobe PhotoShop) where the menu graphics are created.

Read more...

 

 

The 5.2.798 version of the AllWebMenus Web Menu Maker introduces the feature "Show Item or Group on Appear" (under the Main Menu's Group Properties), which specifies whether an Item whose LINK property matches the URL of the loaded web page will be highlighted by default.

show item or group on appear

show item or group on appear

By selecting "Automatically, based on URL", any item whose property matches the URL of the web page that is being viewed will be displayed with its [Mouse Over] or [Mouse Click] state instead of its [Normal] state, thus creating a "highlighting" effect.

Example 1:

Let’s assume that your web menu has a “Company” item that links to the company.html page:

auto item highlight link2

Suppose you browse the following URL:

auto item highlight address2

If the "Show Item or Group on Appear" property of the web menu is set to "Automatically, based on URL" using its "Mouse Click" values, then the menu will appear as follows:

auto item highlight main item

All items are displayed at their [Normal] state except of the “Company” item which is displayed at its [Mouse Click] state, implying that the page viewed is linked by this item.

Example 2:

Let’s assume that your menu has a “Product 2” item in the Products Submenu Group, that links to the product2.html page:

auto item highlight link

Suppose you browse the following URL:

auto item highlight address

If the "Show Item or Group on Appear" property of the web menu is set to "Automatically, based on URL", then the menu will appear as follows...

auto item highlight sub_main

...and when you select the "Products" submenu then the "Product 2" item will be highlighted by default, implying that the page viewed is linked by this item.

auto item highlight sub

As you can see, the parent item (in this case the "Products" item) is also highlighted in order to indicate that a submenu item (i.e. "Product 2") matches the URL of the viewed page.

Note: If multiple items within the web menu link to the same page then all matching items will be highlighted.

Note: The following article describes how you can keep a menu item highlighted automatically. If for some reason (e.g. earlier version users) you would like to use the manual method of keeping a menu item highlighted based on the URL of the loaded page, please read more information here.

 

 

As you might already know, Google has released its new browser under the name “Chrome”.

Keeping our promise to you in maintaining our software’s cross-browser functionality at its best, version 5.1.748 (or above) of our AllWebMenus Web Menu Maker includes fixes that deal with many of the issues initially existed with the Google’s new “Chrome” browser.

Please download the latest version from www.likno.com/download.html (or from your Likno User Area account), install it, recompile your menus and upload to your server the updated menu file AND the –also updated- awmdata folder that contains the libraries – and includes the fix.

We are continuously testing the AllWebMenus application with all updates of Chrome.

 

 

Assuming that you want to create a website with more than one languages you can follow the steps below:

1. Make sure that your web server is properly configured to handle dynamic pages like php, asp, jsp etc.

2. Create two separate menus using the AllWebMenus application. You have to give each menu a different name. In our example the names are:

- english.js

- french.js

3. Compile both menus and link just one of them in the target html page which in our case must be a php page. You can rename the page extension from html to php.

4. Next thing to do is to find a way to pass a variable in that html in order to alter the awm linking code and more precisely the section containing the path of the menu javascript file. This line to be changed is: <script xsrc='english.js' language='JavaScript1.2' type='text/javascript'></script>

If you leave this line intact, then the English menu will be loaded always. What we want in this case is to create a script to change the name of the file under a specific condition. In our example the condition is a parameter in the URL that tells the page what language is the chosen one.

Our URL may be: http://ourdomainname/multiplelang.php?lg=en or http://ourdomainname/multiplelang.php?lg=fr
As you can see the file to contain our menu has to be a php file (or asp, jsp depending on the programming language used) otherwise it will be impossible to pass the lg parameter in the awm linking code.

5. Here is a sample php page containing the code needed for this parameter to be passed in the awm linking code:

<!-- This section contains the code needed for the URL parameter to be passed in our page and to give the menu the proper name -->

<?php

$userLang= $_GET['lg'];

if ($userLang == "en") {

$menuName="english";

}

else {

$menuName="french";

}

?>

<!-- END -->

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title></title>

<script type="text/javascript">

var userLang = "<?php echo($userLang);?>";

var menuName = "";

if (userLang == 'en'){

menuName = "english";
}

else {

menuName = "french";
}

</script>

</head>

<body>

<!-- DO NOT MOVE! The following AllWebMenus code must always be placed right AFTER the BODY tag-->

<!-- ******** BEGIN ALLWEBMENUS CODE FOR menu ******** -->

<script type='text/javascript'>var MenuLinkedBy='AllWebMenus [4]',awmMenuName='menu',awmBN='636';awmAltUrl='';</script>

<!-- The following section creates the javascript needed to load the proper js file -->

<script language="javascript">

document.write( "\<script" );

document.write( " charset='UTF-8'" );

document.write( " type='text/javascript'" );

document.write( " xsrc='" + menuName + ".js'" );

document.write( "\>" );

document.write( "\</script\>" );

</script>

<!-- END -->

<script type='text/javascript'>awmBuildMenu();</script>

<!-- ******** END ALLWEBMENUS CODE FOR menu ******** -->

<span id="awmAnchor-<?php echo($menuName);?>"> </span>

</body>

</html>

Disclaimer: This guideis for users who are familiar with programming languages like php/asp/jsp etc. Improper use of the scripts above may result in menu abnormal appearance and/or script errors.

 

 

In AllWebMenus version 5 all the Themes have been categorized based on their Type, "Horizontal" or "Vertical".

The Apply Theme dialog now allows you to view and choose Themes based on their Type, facilitating your theme selection goals.

AllWebMenus_theme_selection

Note for version 4.x (or previous) users: If you have purchased Theme Packs you will need to download the update for version 5 Theme Packs from your Likno User Area account.

Note: In this demonstration AllWebMenus DHTML Menu Maker version 5.1 build #734 was used.

 

 


© 2009 Likno Software Blog – Drop-Down Menus, Javascript Menus, DHTML Menus