Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Adobe Dreamweaver

  • Print
  • + Share This
From the author of

Phase 1: Create the Database Table

Your data table spreadsheet will use columns as fields and will use rows to list specific items (records). For example, the table I use to display my recent books has fields called Title, Cover Artwork, Date Published, and Summary. The specific information will be different for each book in my table, but all the books will have the same fields.

The Dreamweaver web page you use to store your data in a table will not be available to people who visit your website. This page will be accessed only by you or by others who maintain and update the data in that table. Here's how you create it:

  1. In Dreamweaver CS4, choose File > New to open the New Document dialog. Choose Blank Page from the category list on the left, choose HTML / None as the page type, and click Create.
  2. Save the new blank page with an appropriate filename such as datatable01.
  3. Choose Insert > Table to open the Table dialog (see Figure 1). Fill in the dialog with the appropriate settings to create your table:
    • Leave the Rows box set to the default number. (You can easily add rows to your table as you enter new items into it.)
    • In the Columns box, enter the number of fields (columns) needed to organize your data. In Figure 1, for example, I'm creating four columns.
    • Set Table Width to 100% to create the most convenient layout to enter data.
    • Leave the Border Thickness set to 1.
    • Set Cell Padding to 6 to make the table data more readable, by providing a buffer between the different rows and columns of data.
    • In the Header section of the dialog, select Top. This setting provides automatic formatting for your column headings.
    • In case the table will be used by people with visual handicaps, enter a caption (and possibly a summary) to improve accessibility.
  4. When you're finished defining the table properties, click OK to generate the table.
    Figure 1

    Figure 1 Defining a table to hold data for a Spry Data Set.

  5. In order to use your new table as part of a Spry Data Set, you need to assign a name to the table. Oddly (and unfortunately), Dreamweaver CS4 doesn't allow you to assign the table name during the table creation process. So, before moving on, name the table. Since you've just finished creating the table, it's currently selected. In the Properties inspector, which displays (and controls) table properties, enter the name of the table in the Table box.
  • + Share This
  • 🔖 Save To Your Account