Accessibility

Table of Contents

  1. Introduction
  2. Preparing Your Files
  3. Learn About Using XML and XSL with Web Pages
  4. Learn About XSLT Pages
  5. Convert an HTML Page to an XSLT Page
  6. Bind XML Data to the XSLT Page
  7. Create a Dynamic Link
  8. Add a Repeat Region XSLT Object
  9. Attach the XSLT Page to the XML Page
  10. Learn About Other Deployment Options

Displaying XML Data

Preparing Your Files

Locate Your Files

The files you'll need to complete this tutorial are located in the xml folder, inside the cafe_townsend root folder that you copied to your computer in Setting Up Your Site and Project Files. If you did not complete that tutorial, you must do so before proceeding. The xml folder contains the main file you'll be working with in this tutorial (xml_menu.html), the CSS style sheet for the menu page (xml_menu.css), a file containing your XML data (specials.xml), an images folder, and a number of other HTML pages. The finished version of the tutorial, xml_menu.xsl, is located in the cafe_townsend/completed_files/dreamweaver/xml directory.

Review Your Task

Cafe Townsend, a fictional restaurant, currently posts a list of daily specials on their website. They use an HTML table with a series of table rows to display the information. The left column of each row displays the name of the item and the item's description. The right column of each row displays the item's price. All of the information on the page is hand-coded (i.e., it is not coming from a dynamic data source), and the text is formatted with an external style sheet.

The page you will create in this tutorial

Figure 1. The page you will create in this tutorial

(+) View larger

The owners of Cafe Townsend have decided to “go dynamic,” and use data from an XML file to display their daily specials. Using XML allows for a separation between the content of the page (the menu specials) and the presentation (the layout, text styling, and so forth). An employee who doesn't know anything about HTML or web page maintenance can easily update the information by editing the XML file, while the page displaying the menu information remains stylistically untouched.

In this tutorial you'll convert the existing specials page (an HTML page) to an XSLT page so that you can display XML data on the page. You'll also apply styles to the XML data so that the appearance of the data is in keeping with the rest of the page.

If you're comfortable working with XML, XSLT, and client-side transformations, you can skip to the section on Converting an HTML Page to an XSLT Page. If you are new to any of these concepts, read the next sections.

Page 2 of 10
Previous Page
Next Page