Using Dreamweaver to Create Pop-Up Windows for Multimedia Glossing of Texts

Step Two: Create an HTML File for the Primary Text

Glossing a text consists of choosing a primary text (poem, short story, newspaper article, &c.) in the target language, mapping out that primary text for contextual information (vocabulary glosses, cultural information, idioms, important people/places), and linking the text markers in the primary text out to a second piece of information that assists the reader in understanding the primary document at hand.

Glossing with Dreamweaver is essentially hyperlinking specific words or phrases in the primary document to additional bits of information in the form of still images, video, audio, or text-based definitions. For this exercise, this linking is accomplished through a piece of javascript code that tells your web browser (Internet Explorer, Netscape) to open up a smaller window and display the information in a second HTML file.

  1. The first step is to create an HTML file in which you will paste or type your primary text.
  • In order to have the javascript code in the correct place within the HTML file, I have created an empty HTML file with the javascript code already in place.
  • Download this file (pri_txt_template.html), by right-clicking on the link and saving the target as a new file name. Save the file in the folder that you set up on your local machine within your site defintion in Step One. If you do not download this specific file, then the popup window function will not work properly.
  1. Next, in Dreamweaver open the HTML file you just saved, and copy and paste your primary text over the text "Insert your primary text here."
  2. Choose a word or phrase in your primary text that you want to gloss for additional information.
  3. Highlight this word or phrase with your cursor. Next, in the Dreamweaver Properties Window, copy the following line of text:

    javascript:popup('filename.html') -- filename.html is the name of the HTML file you are glossing to, such as gloss1.html. Remember: there is a single openquote and closequote surrounding the filename, so: 'gloss1.html'

  4. To set the hyperlink, click anywhere in your HTML document. The word or phrase you highlighted should now be a different color, and underlined, denoting that a hyperlink has been created.

Proceed to Step Three!

 

ASU Dept. of Languages and Literatures Arizona State University Home Page