Adding Drop-Down Menu to a Web PageUpdated: February 07, 2017 | Posted: March 14, 2014 | By Andrei Pogorelov
No programming or design skills are necessary to create a professional menu with Drop Down Menu Generator. The main advantage of the Generator is that it does everything automatically, quickly, easily and gives out the professional drop-down menu for any web site.
In this short post, I will describe the next step: adding the menu to pages of your website.
It is the easiest, simplest way to add your menu to any web page. Your menu is hosted on our server; you use a small code to display the menu directly on your web pages.
If you want to have the menu as a part of your website, follow all of the steps described below.
Adding the menu to your website
Placing the menu on the page
Now that you have the "MyMenu1" folder as a part of your website, you can drop the menu into the pages. You embed the menu in a web page by modifying its HTML source.
All you need is to paste the menu code where you want your menu to show up.
That is all. Your final page code should look as follows:
The menu code consists of the two parts:
The <div> element is used as a container for the menu data. It includes the menu name ("MyMenu1") as an identifier.
Let's look at the <script>.
As described earlier, we have placed the "MyMenu1" folder in the root directory of the website. The "src" attribute can have the following values:
- The page is located in the root directory (where the "MyMenu1" folder is):
- The page is located in the subfolder. In other words, the "MyMenu1" folder is located in a directory one level up from the current directory where the page is:
- The "MyMenu1" folder is located in a directory two levels up from the current directory where the page is:
- The full URL for a page located in any directory:
The following picture shows the correct path to the "MyMenu1.js" file, depending on the page location.
It is important to note, that the single "MyMenu1" folder is used to show the menu on multiple pages. If you need to update the menu on all of your pages, you should only replace the current "MyMenu1" folder with a new one. It is not required to edit code on the pages.
I hope this short post will help you to add a drop-down menu to your website. Please do not hesitate to ask questions.
Sample Code: MySite.zip
Video Tutorial: Adding Menu to a Web Page via Embed Code
Video Tutorial: Adding Menu to Your Website
Menu Generator: http://www.dropdownmenugenerator.com
Question Form: http://www.dropdownmenugenerator.com/ContactUs.aspx