Simple HTML Drop Down Menu Generator


  • The following wizard generates the code necessary for your own simple drop down menu. Each option on your menu will link to a selected page. Options are also given for you to select the colors and fonts.


  1. Fill in the information required for your drop down menu
  2. Generate the HTML and JavaScript code for your menu (button at bottom)
  3. You can preview your script (button at bottom)
  4. Copy and Paste the Source Code into your HTML page



  • If you choose Page changes when menu changes, no action can occur for the first Link Address
  • You can leave Link Address blank on the lines where you want the text entry to act as a divider or a menu header

When and how to change the page

Menu Properties
Menu Name:
(change menu name if multiple menus on one page)
Custom Target:
Target Name:
Dropdown Menu Entries
Text Shown Link Address

Custom Colors/Styles

(Check the above box to enable these Style Sheet options)
Text Color Background Color
[pick] [pick]
Font Family Custom Font

Font Style Font Size

Source Code


Ok, One of my text entries in the drop down list is long. The box then stretches too far to accommodate the text, even running off the edge of the screen! How do you make it so that the box is locked in a specific width and the text adjusts itself to form 2 lines? Shortening the title of my text is not an option for me, but breaking it into two lines is ok. Please, can you help?

There is no way to wrap it to use 2 lines. However, you can force a certain width to the select box. Add a style="width:200px;" property to the <select> tag like <select name="menu" style="width:200px;"> (exact code will vary depending on which type of menu you are using)

The drop down menu appears to be on the top left hand corner of the window. How do I change it's position?

You can change the position by placing the menu code inside a container with alignment set:

<div style="text-align:right;"> menu code </div>

I have 25 options for my dropdown. Is there a way to expand this menu to accommodate them all?

Yes, it can be expanded to any size. Just use a text editor to add additional option lines in the same format as the existing ones like:
<option value="">Google</option>

Is there any way we can prevent the borderline that define the drop down boxes?
I mean, can we just have the text without ANY LINES, please?

Since this menu uses the browser's form <select> field, there's not any good way. You'd really need to have a menu that was built using custom objects. That said, you can sort of do what you are asking by adding style="border:0;" to the <select> box like
<select name="menu" style="border:0;">

Hi is it possible that when a catagory is selected to go to it opens a new window? i tried selecting Different Window for the Custom Target when i generated the menu but it didnt work when i placed the code into my website.

Choosing "Pop Up Window" as the target should do what you want.