ptg 192 Chapter 8 After you finishing creating the table layout and cells, you can insert content. You can add text, images, and other data in Standard or Expanded Table modes. Simply click in the cell where you want to add material, and then type, paste, or insert the content you want. If you have content available in the Assets or Files panel, you can drag it into the table; releasing your mouse when you're hovering over the right cell. You can only add content to layout cells; the empty grey area in a layout table is not available for content. When you add content to a cell, it automatically expands to accommodate the incoming content, which changes the size of the column and table. Adding Content into a Table Add Text or an Image to a Table Open the Web page that contains the table you want to add content. Click to place the insertion point in the layout cell where you want to add content. To ad d text, type or paste the text you want. ◆ Press Enter (Win) or Return (Mac) to add a paragraph return. ◆ Press Shift+Enter (Win) or Shift+Return (Mac) to add a soft return. NOTE By default, the text is left justified and centered within the cell, and soft wraps at the end of the table cell. To ad d an image, click the Insert menu, click Image, select the image file you want, and then click OK. The table expands to accommodate the text or image content. 4 3 2 1 1 4 2 3 See Also See “Importing Tabular Data” on page 93 for information on importing data and creating a layout table. From the Library of Wow! eBook ptg Chapter 8 Working with Web Page Tables 193 Modify Table Text Select the table text you want to modify. In the Properties panel, modify the text using the following options: ◆ Format. Click to change the basic HTML format of the text (heading and paragraph styles). ◆ Style. Click to work with CSS style sheets. ◆ Alignment. Click to change the justification of the text (Align Left, Align Center, Align Right, or Justify). ◆ Bold/Italic. Click to bold or italicize the selected text. ◆ Font. Click to change the default font of the selected table text. ◆ Size. Click to change the default size of the selected table text. ◆ Color. Click to change the color of the selected table text (black, default). 2 1 1 2 Did You Know? You can sort rows in a table. If you don’t have any merged cells in a table, you can sort the table. Select the table or click in any cell, click the Commands menu, and then click Sort Table. In the Sort dialog box, set the options you want, and then click OK. Some of the sort options include Sort By, Order, Sort Includes The First Row, Sort Header Rows, Sort Footer Rows, and Keep All Row Colors The Same After The Sort Has Been Completed. From the Library of Wow! eBook ptg 194 Chapter 8 Instead of retyping data in a table that you have in another document, such as Microsoft Excel, you can import it into a table in Dreamweaver. The tabular data needs to be saved in a delimited text format with items separated by tabs, commas, colons, or semicolons. If you want to use data from a table in Dreamweaver in another document, you can export table data into a text file. When you export a table, the entire table is exported. You cannot export parts of a table. However, you can copy parts of a table and paste it into another document. Importing and Exporting Table Data Export Table Data Open the Web page with the table you want to format. Click to place the insertion point in any cell of the table. Click the File menu, point to Export, and then click Table. Specify the following options: ◆ Delimiter. Specifies the character you want to separate items in the exported file. ◆ Line Breaks. Specifies the operating system in which you want to open the exported file. Different operating systems use different ways of indicating the end of a line break. Click Export. Navigate to the location where you want to save the file. Enter a name for the file. Click Save. 8 7 6 5 4 3 2 1 4 5 7 8 6 From the Library of Wow! eBook ptg Imported data into a table Chapter 8 Working with Web Page Tables 195 Import Tabular Data into a Table Open the Web page with the table you want to use. Click to place the insertion point in any cell of the table. If you click in an existing table, you’ll create a nested table. Click the File menu, point to Import, and then click Tabular Data. Specify the following options: ◆ Data File. Enter the name of the file, or click Browse to select it. ◆ Delimiter. Specify the character used to separate items in the imported file. Select Other to enter a delimiter character. ◆ Table Width. Specifies the width of the table. Select Fit to Data to make each column wide enough to fit the data. Select Set to specify an exact width. ◆ Cell Padding. Specifies the number of pixels between a cell's content and the cell boundaries. ◆ Cell Spacing. Specifies the number of pixels between adjacent table cells. ◆ Format Top Row. Specifies the formatting applied to the top row. ◆ Border. Specifies the width in pixels of the table’s border. Click OK. Dreamweaver creates a new table with the tabular data from the imported file. 5 4 3 2 1 4 5 From the Library of Wow! eBook ptg 196 Chapter 8 As you begin to work on a table, you might need to modify its structure by adding more rows and columns to accommodate new text, graphics, or other tables. The table realigns as needed to accommodate the new structure. When you insert rows or columns, the existing rows shift down, the existing columns shift right, and you choose what direction the existing cells shift. Similarly, when you delete unneeded rows, columns, or cells from a table, the table realigns itself. Adding Columns or Rows to Tables Add a Column or Row to a Table Open the Web page with the table you want to modify. Click to place the insertion point where you want to add a row or column. To ad d a row or column, click the Insert menu, point to Table Objects, and then click Insert Columns to The Left, Insert Column to The Right, Insert Row Above, or Insert Row Below. TIMESAVER Use buttons on the Layout tab on the Insert panel or the column header menu (arrow above a column) for columns. To ad d multiple rows or columns, click the Modify menu, point to Table, click Insert Rows Or Columns, enter the number of columns or rows you want to add to the table, and the related options, and then click OK. 4 3 2 1 3 4 Did You Know? You can delete rows and columns in a table. Select the rows or columns you want to delete, click the Modify menu, point to Table, and then click Delete Row or Delete Column. Enter number of columns or rows From the Library of Wow! eBook ptg Chapter 8 Working with Web Page Tables 197 Resizing Columns and Rows Modify Column Widths and Row Heights Open the Web page with the table you want to modify. To ch ange a columns width, use any of the following: ◆ Change Column Width and Keep Table Width. Drag the right border of the column to change it. ◆ Change Column Width and Keep Other Column Widths. Shift-drag the column border. ◆ Clear Column Width. Click the Column Header Arrow, and then click Clear Column Width. To ch ange a row height, drag the lower border of the row. Click the Table Header Arrow, and then select any of the following options: ◆ Clear All Heights or Clear All Widths. Removes the excess empty space in a cell. ◆ Make All Widths Consistent. Makes all the column widths the same. ◆ Hide Table Widths. Hides the table widths at the top of the table. 4 3 2 1 After you create a table, you can resize the columns and rows to fit your space and data needs. You can set a column to a variable, fixed or consistent width. If you see two numbers for a column’s width, then the column width set in the HTML code doesn’t match the columns width on the screen. You can make the width specified in the code match the visual width. After you insert content into the cell, you can clear the excess width and height of the cell. 2 31 4 From the Library of Wow! eBook . available for content. When you add content to a cell, it automatically expands to accommodate the incoming content, which changes the size of the column and table. Adding Content into a Table Add. to a Table Open the Web page that contains the table you want to add content. Click to place the insertion point in the layout cell where you want to add content. To ad d text, type or paste. table expands to accommodate the text or image content. 4 3 2 1 1 4 2 3 See Also See “Importing Tabular Data” on page 93 for information on importing data and creating a layout table. From