Sie sind hier: de.sothink.com > Produkte > Sothink DHTML Menu >How to add a dropdown menu to HTML page?

HTML Dropdown Menu, the ultimate html dropdown menu builder

How to add a dropdown menu to HTML page?

A html dropdown menu typically contains a list of pages on your site that your visitors can select from a dropdown list. The following tutorial walks you through adding a html dropdown menu to your page. Let’s do it for a check.

Step 1

Please open an existing page locally in your web page editor (e.g. Dreamweaver) or create a new page and save it to a new created folder (named “menu” for example) in your computer.

Step 2

Launch your html dropdown menu editor (usually we use Sothink DHTML Menu) and create a html dropdown menu next, after the html dropdown menu is done, save the html dropdown menu as a PGT file to the “menu” folder, and then click the button "Publish" and choose the option "Publish JS...". to publish the html dropdown menu.

Step 3

Click Folder button to choose a directory to save the generated js file for the html dropdown menu. Here we set the path as “E:\tutorial\menu\topmenu.js”. But make sure you set the path of the js file inside the site root folder, or you have to modify the js file path manually.

Step 4

Click the first button "Copy All" to copy the menu code within <HEAD> tag of HTML code, and then find such tags in your HTML page: <Head> and </Head>.

Next, please paste the menu code between <head> and </head> of your HTML page.

Step 5

Then, click the second button "Copy All" to copy the menu code within <BODY> tag of HTML code, find the tage <Body> and </Body> in your HTML page, and paste the menu code between <body> and </body> there.

Step 6

Turn to Dreamweaver and save the html page.

Step 7

Go to Sothink DHTML Menu, and check the option "Copy the resource files" to copy and paste the resource files used in this html dropdown menu to the defined folders; next, click OK, the program will copy and paste the resource files automatically.

At last, you can preview your html dropdown menu in a browser for a check. If it works well, it means you have added the html dropdown menu to your webpage successfully.

P.S. A html dropdown menu is where you have multiple options stored in a menu accessible by using the scroll bar arrow. You can refer to the page here for the video tutorial about adding the html dropdown menu to webpage.

DHTML Menu
- Navigate website clearly by drop down menu
About Sothink DHTML Menu

DHTML Menu is an easy-to-use navigation bar maker. It can create SEO friendly drop down menu, JavaScript menu and naviation bar for website in few minutes. For beginner, build professional navigation bar from built-in templates and preset styles; for expert, fully custmize the drop down menu. The best navigation bar is prodoced by DHTML Menu.

100% Clean - No need to worry about installing unwanted spyware or adware. Uninstallation is completely supported.
Life-time Free Support - Send an email to our customer service team at support@sothink.com whenever you need help.
Risk Free Guarantee - Shop safely in our secure online store. Your data and personal information are protected.