User Guide Cancel

Create repeating regions and tables in Dreamweaver

Last updated on Apr 27, 2021

Create repeating regions and repeating tables, and configure table properties in Dreamweaver to control your page layout.

A repeating region is a section of a template that can be duplicated many times in a template-based page. Typically, repeating regions are used with tables but you can define a repeating region for other page elements.

Repeating regions enable you to control your page layout by repeating certain items, such as a catalog item and description layout, or a row for data such as a list of items.

There are two repeating region template objects you can use: repeating region and repeating table.

Create a repeating region in a template

Repeating regions enable template users to duplicate a specified region in a template as often as desired. A repeating region is not necessarily an editable region.

To make content in a repeating region editable (for example, to allow a user to enter text in a table cell in a template-based document), you must insert an editable region in the repeating region.

In the Document window, do one of the following:
- Select the text or content you want to set as a repeating region.
- Place the insertion point in the document where you want to insert the repeating region.
Do one of the following:
- Select Insert > Template > Repeating Region.
- In the Templates category of the Insert panel, select Repeating Region.
In the Name box, enter a unique name for the template region. (You cannot use the same name for more than one repeating region in a template.)

Note:

When you name a region, do not use special characters.
Click OK.

Insert a repeating table

You can use a repeating table to create an editable region (in table format) with repeating rows. You can define table attributes and set which table cells are editable.

In the Document window, place the insertion point in the document where you want to insert the repeating table.
Do one of the following:
- Select Insert > Template > Repeating Table.
- In the Templates category of the Insert panel, select Repeating Table.
Specify the following options and click OK.

Rows

Determines the number of rows the table has.

Columns

Determines the number of columns the table has.

Cell Padding

Determines the number of pixels between a cell’s content and the cell boundaries.

Cell Spacing

Determines the number of pixels between adjacent table cells.

Note:

If you don’t explicitly assign values for cell padding and cell spacing, most browsers display the table as if cell padding were set to 1 and cell spacing were set to 2. To ensure that browsers display the table with no padding or spacing, set Cell Padding and Cell Spacing to 0.

Width

Specifies the width of the table in pixels, or as a percentage of the browser window’s width.

Border

Specifies the width, in pixels, of the table’s borders.

Note:

If you don’t explicitly assign a value for border, most browsers display the table as if the border were set to 1. To ensure that browsers display the table with no border, set Border to 0.

To view cell and table boundaries when the border is set to 0, select View > Design View Options > Visual Aids. This option is available only in the Design view.

Repeat Rows of the Table

Specify which rows in the table are included in the repeating region.

Starting Row

Sets the row number entered as the first row to include in the repeating region.

Ending Row

Sets the row number entered as the last row to include in the repeating region.

Region Name

Lets you set a unique name for the repeating region.

Creating repeating tables

Set alternating background colors in a repeating table

After you insert a repeating table in a template, you can customize it by alternating the background color of the table rows.

In the Document window, select a row in the repeating table.
Click the Show Code View or Show Code And Design Views button in the Document toolbar so you can access the code for the selected table row.
In Code view, edit the <tr> tag to include the following code:
```
<tr bgcolor="@@( _index & 1 ? '#FFFFFF' : '#CCCCCC' )@@">
```
You can replace the #FFFFFF and #CCCCCC hexadecimal values with other color choices.

Save the template.

The following is a code example of a table that includes alternating background table row colors:

<table width="75%"  border="1"  cellspacing="0" cellpadding="0"> 
<tr><th>Name</th><th>Phone Number</th><th>Email Address</th></tr> 
<!-- TemplateBeginRepeat name="contacts" --> 
<tr bgcolor="@@(_index & 1 ? '#FFFFFF' : '#CCCCCC')@@"> 
<td> <!-- TemplateBeginEditable name="name" --> name <!-- TemplateEndEditable --> 
</td> 
<td> <!-- TemplateBeginEditable name="phone" --> phone <!-- TemplateEndEditable --> 
</td> 
<td> <!-- TemplateBeginEditable name="email" --> email <!-- TemplateEndEditable --> 
</td> 
</tr> 
  <!-- TemplateEndRepeat --> 
</table>

More like this

Adobe

Get help faster and easier

New user?