Add a Drop Down Box in Dreamweaver

'A drop down box is similar to a text box except it allows you to select options from a drop down menu instead of typing in the text. The list of menu options appears when the user clicks on the box prompting him or her to make a selection. You can add a drop down box in Dreamweaver by inserting it as a form on your web page. Another method is to use the Vista Buttons extension that adds more options in Macromedia Dreamweaver for adding drop down boxes.

Steps

  1. Run the Dreamweaver software.
  2. Access the document in Dreamweaver. You can create a new HTML document or open the web page that you want to add the drop down box to in Dreamweaver (you can create new documents or open existing documents in Dreamweaver through the File menu on the top left).
  3. Click on the area where you want to insert the drop down box.
  4. Go to "Insert" in the top menu.
  5. Select "Form."
  6. Choose the correct form type. It may be labeled as "Jump Menu" or "List/Menu" depending on which version of Dreamweaver you are using.
  7. Enter the list of menu items. These will be the menu options that will appear in the drop down box. You need to click on the plus sign every time you need to add a new option in the list.
  8. Assign a menu ID. This is for your own reference and you can assign an ID such as "dropdown" to remember what this form is for.
  9. Press the "OK" button. The drop down menu will be inserted as a form.

Vista Buttons

  1. Download Vista Buttons using the download link on the Vista Buttons website.
  2. Run the installation wizard. It is preferable to not be running Dreamweaver while doing this.
  3. Put a tick next to "Dreamweaver" when you are asked which programs you want to install the plug-ins for.
  4. Continue to press the "Next" button until the installation process is complete.
  5. Run the Dreamweaver software. You should see the Vista Buttons toolbar appear at the top.
  6. Press the "Insert menu" button on the Vista Buttons toolbar. This will launch the Vista Buttons wizard allowing you to add a drop down box in Dreamweaver using various preset templates.
  7. Select "Save and Close" to finalize your settings. The drop down box will be added in your Dreamweaver document with the appearance that you specified.

Tips

  • Hit F12 on your keyboard to preview the document that you have open in Macromedia Dreamweaver. The document should open as a web page on your Internet browser and you should see how the drop down box will finally appear after you upload the web page.

Warnings

  • Dreamweaver must already be installed on your computer before you can install the Vista Button plug-ins for Dreamweaver.

Related Articles

Sources and Citations

You may like