Contact Us or call 1-877-932-8228


Anchors are named locations to which a link can point. Anchors make it possible to link to a specific location on a page.

Follow these steps to add an anchor in Dreamweaver CS6 using the pre HTML5 way:

  1. Place the cursor where you want to add the anchor.
  2. Select Named Anchor from the Insert menu or the Common Insert panel.
  3. In the resulting dialog, enter a name for your anchor (no spaces allowed):

To illustrate let's add an anchor to the top of ClassFiles/Dreamweaver/Exercises/Anchors.html so that we can add a "Back to Top" link at the bottom of the page:

  1. Open ClassFiles/Dreamweaver/Exercises/Anchors.html in Dreamweaver.
  2. With the cursor at the very beginning of the page (before the "Anchors" heading), select Insert > Named Anchor:
  3. In the Named Anchor dialog, enter "Top":
  4. You should now see an anchor icon () in front of the "Anchors" heading. If you do not, you may need to change your preferences by selecting Edit > Preferences and then selecting the "Invisible Elements" category and checking Named anchors:

You are now ready to create a link to your new anchor. To do so:

  1. Scroll down to the bottom of your Anchors.html page and highlight "Back to top."
  2. In the Properties Inspector, enter "#top" in the Link field. The pound sign or hash mark (#) at the beginning of the link value is important. It tells the browser to search for an anchor on the page.
  3. Save your page and open it in the browser.
  4. Scroll to the bottom of the page and test the link. Does it bring you back to the top?

To link to anchors on remote sites, simply include the whole URL followed by a pound sign and the anchor. For example: http://www.example com/index.html#anchorname. Or in the case of a default page: http://www.example com/#anchorname.

Please note that HTML5 no longer uses the above technique. Instead, simply use the id= attribute to give a location a name, and then link to that name using a # at the beginning. Much easier and more direct.

To add an anchor in Dreamweaver CC using the proper HTML5 way:

  1. Place the cursor where you want to add the anchor.
  2. Use the ID field to name the area.
  3. Create the link to the new named area (#name).