Working with Repeating Regions


As you have seen thus far, editable regions provide some level of flexibility in terms of allowing users working with template-derived pages to add and modify content in areas on the page that you, as the template designer, specify as editable. In our example, we made the assumption that various departments in our organization would need to create an instance of the template and customize certain areas (editable regions) to suit their needs. Up to this point, we've discussed allowing the users to customize the small subheading images by allowing them to replace image placeholders with their own department-specific images. We also added a third editable region that allowed the user to add text for the main content of the template-derived page. What we haven't done yet is set aside the Events table as editable.

The challenge with making the Events table editable is that we need to be careful not to make the entire table editable. Technically, we could create one big editable region and then place the Events table in that editable region. The problem with this approach is that the user would be able to change the heading that appears in the table as well as the small calendar icon that appears just to the left of each row. Because we want to keep a level of consistency across departments, allowing the department users to do this wouldn't be the best idea. Instead, we can keep the locked design of the table but set aside a row in the table as a repeating region. This would allow the user to continuously add rows to the table, while at the same time preserving the overall look and feel of the table.

To enable a repeating region for the Events table, follow these steps:

1.

Select the first row in the Events table by placing your cursor in one of the cells in the row you want to select and choose the <tr> tag from the Tag Selector. The row is selected.

2.

Choose Insert, Template Objects, Repeating Region. The New Repeating Region dialog appears.

3.

Enter the name EventItems and click OK. A light blue invisible element box similar to the editable region appears, surrounding the selected row in the table.

4.

Our next step is to define the three cells in the repeating region as editable regions: Place your cursor in each cell and choose Insert, Template Objects, Editable Region. When the New Editable Region dialog appears, name your editable regions UpcomingEvent, TimeDate, and Location respectively. When you finish adding the three editable regions, the table should resemble Figure 15.13.

Figure 15.13. Add three new editable regions in the repeating region of the Events table.


5.

Save your work.

Alternatively, you can create a table with repeating rows by choosing Insert, Template Objects, Repeating Table. Selecting this option reveals the Insert Repeating Table dialog, similar to Figure 15.14.

Figure 15.14. Use the Repeating Table option to quickly create a table that has repeating rows.


The Insert Repeating Table dialog allows you to quickly construct a table by customizing Rows, Columns, Width, Border, Cell Padding, and Cell Spacing values. The second half of the dialog allows you to set the starting and ending rows for the repeating row as well and the name to be associated with the repeating region. Personally, I prefer to construct the table on my own and then designate the repeating and editable regions because this method is much more flexible for creating column headers and graphics that I want to appear next to each row. The method you decide to use is entirely up to you.

Adding Content to Repeating Regions

As we did with the editable regions example, let's switch roles for this section and play the role of a department web developer. Assume that we need to add some department events to our new template-derived page. To do this, follow these steps:

1.

Open a new instance of the template by choosing the New option from the File menu. The New Document dialog appears. Choose the Templates tab, select the template option from the Dorknozzle site, and click the Create button. A new instance of the template appears.

2.

Because I'm playing the role of the department web developer and I need to add a new event, I'll type text into the editable regions in the first row. When you've finished, your row, complete with customized text, should resemble Figure 15.15.

Figure 15.15. Add a new custom event to the first row in the Events table.


3.

We need to add a second event. Unfortunately, the table is locked by the template, so using traditional methods of adding rows to the table simply won't work. Instead, we must use the small buttons that appear in the repeating region. As you can see from the callouts in Figure 15.15, buttons exist for adding, removing, and reordering rows in the Events table.

4.

Because we need to add a new row, click the Add Row (+) icon. This action adds a new row to the Events table similar to Figure 15.16.

Figure 15.16. Add a new row to the Events table by clicking the Add Row (+) icon.


5.

We can add custom text to the new row to complete the addition of the second row to the Events table.

Of course, we can also remove and reorder items in the table by clicking other options in the button menu as well. The downside to using this menu however, is that it appears only when invisible elements are turned on. If you're like me and prefer not to have invisible elements turned on, adding new rows to the repeating table could pose a challenge. To demonstrate this, turn invisible elements off by disabling the Invisible Elements option located in the Visual Aids menu in the Document bar similar to Figure 15.17. Notice that the small button menu for adding, removing, and reordering rows in the Events table no longer exists.

Figure 15.17. Uncheck the Invisible Elements option.


To continue to add and reorder rows within the repeating table when invisible elements are turned off, we must turn to the options available from the Modify, Templates submenu:

  • New Entry Before Selection

  • New Entry After Selection

  • New Entry Up

  • New Entry Down

To cut, copy, or delete rows within a repeating table, choose one of the options available from the Edit, Repeating Entries submenu:

  • Cut Repeating Entry

  • Copy Repeating Entry

  • Delete Repeating Entry




Macromedia Dreamweaver 8 Unleashed
Macromedia Dreamweaver 8 Unleashed
ISBN: 0672327600
EAN: 2147483647
Year: 2005
Pages: 237
Authors: Zak Ruvalcaba

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net