how to position a javascript menu in joomla

How to position a JavaScript menu in Joomla

&

www.likno.comAllWebMenus Pro

http://www.likno.com/allwebmenusinfo.html?src=slideshare

In this presentation we will show you how to position your JavaScript menu in your Joomla website, through AllWebMenus Pro and the AllWebMenus Joomla Component.



In general, there are 4 main choices to position a menu in AllWebMenus Pro: Relative to Window:



Relative to an Element:



Relative to an Image:



Manually trigger Main Menu or any Group on user action:



While you are in AllWebMenus Pro, you can set the Menu Positioning by clicking on “Menu Positioning” button.



Let’s see each choice separately and the steps needed to be done in AllWebMenus Pro and in AllWebMenus Joomla Component.



First, let’s see the “Relative to Window” positioning. Click on “Menu Positioning” and choose “Relative to Window”. You are able to also set the Window Anchor and the Offsets.



Then, you need to Compile your menu project for Joomla and upload the zip file through your AllWebMenus Joomla Component panel.



Then, just visit your Joomla website and you will see the menu displayed where you placed it relative to the window.



Let’s see the “Relative to an Element” positioning. Click on “Menu Positioning” and choose “Relative to an Element”. You see that you have 2 choices, relative to the Default ID or relative to a Custom ID (in which you can type your custom ID). You are able to also set the Window Anchor and the Offsets.



If you know that you have a specific ID in your Joomla website or you want to manually add it, you can choose the Custom ID. Then, you only need to compile your menu project and upload the zip file to your Joomla. The menu will be displayed on your pages as long as the custom ID exists on them.



If you choose the Default ID you need to also compile and upload the zip file. Then, in order for the menu to be displayed you need to publish the specific AllWebMenus Module that is created for your menu.



So, after you have uploaded the produced zip file click on Extensions -> Module Manager.



Search for “AllWebMenus” and you will see that a module with the name of your menu is created. You can click on that to select the position where you want it to appear.



Choose the Position where you want your menu to be displayed. Also, make sure that the status is set to Published. Then, the menu should appear where you selected.



Then, just visit your Joomla website and you will see the menu displayed in the position you chose.



Let’s see the “Relative to an Image” positioning. Click on “Menu Positioning” and choose “Relative to an Image”. Type the Image Filename. Note that the image should exist in your page. Then, you can also set the Anchors and Offsets.



Then, you need to Compile your menu project for Joomla and upload the zip file through your AllWebMenus Joomla Component panel.



Then, just visit your Joomla website and you will see the menu displayed where you placed it relative to the image.



Now, let’s see the Manually trigger Main Menu or any Group on user action.This is a more advanced method to show your menu and it requires that you insert some code on your Joomla page.Click on Click here to generate the “Trigger Code” for Main Menu or any Group.



You are able to select if the menu will be triggered on Mouse Over or on Mouse Click. You can choose the Positioning Element as well as the Anchors and Offsets for the menu. Finally, you can click on “Copy” to copy the produced code.

Of course, when you are done you need to compile your menu project and upload the produced zip file to your Joomla.



In order for the menu to appear on your page, you need to paste in your menu trigger element the code you copied in AllWebMenus Pro.

So, you could have for example a button that clicking on it the menu would be displayed:

<button onclick="awmShowGroup('menu-gr0',0,0,0,0,this);" onmouseout="awmHideMenu('menu');" >Click here</button>



Visit www.likno.com

for more information


http://www.likno.com/


how to position a javascript menu in joomla

Software