IT tutorials
 
Graphics
 

Dreamweaver CS5 : Using Dreamweaver Templates - Enabling Repeating Regions

11/27/2011 9:33:02 AM
- Free product key for windows 10
- Free Product Key for Microsoft office 365
- Malwarebytes Premium 3.7.1 Serial Keys (LifeTime) 2019
Data-driven pages handle repeating regions elegantly. A single row of a table is bound to data, and the application server returns as many requested rows as are available. However, not all pages are data-driven — and not all areas of a page that repeat can be bound to a data source. Dreamweaver provides solutions for both the server-side — the Repeat Region server behavior — and the client-side — the template-based repeating region feature.

A repeating region, like an editable region, is applied to a template and may surround any tag-complete area (an area containing both a beginning tag and an ending tag) on a page. Typically, repeating regions wrap around the same type of areas as their server behavior cousins, such as table rows. However, unlike the Repeat Region server behavior, template repeating regions are expanded and manipulated manually in a template-based document. Keep in mind one other important aspect of repeating regions: They aren't automatically editable — you have to include an editable region within a repeating region to make it so. The capability to lock specific portions of repeating regions makes this an extremely powerful feature.

To insert a repeating region, follow these steps:

  1. Select the portion of the page that you want to repeat. As noted earlier, a repeating region cannot overlap a tag pair. If you attempt to do this, Dreamweaver automatically extends the selection so that the entire tag is included.

  2. Choose Insert => Template Objects => Repeating Region or, from the Templates group of the Insert panel, click the Repeating Region.

  3. Enter a unique name in the New Repeating Region dialog box and click OK. Dreamweaver automatically provides a name, but as always, it's best if you supply a meaningful name. Dreamweaver surrounds the repeating region with a blue border and tab with the keyword "Repeat" and the name of the region, as shown in Figure 1.

Figure 1. Repeating regions are marked in templates with an outline and named tab, just like editable and optional regions.

As mentioned earlier, repeating regions are not, by default, editable. To make a repeating region editable, select the content within the repeating region — not the repeating region itself — and then create an editable region by either clicking the Editable Region icon in the Templates menu of the Insert panel or choosing Insert Editable Region. You must give the editable region a unique name as usual. Template Objects

You may notice that the repeating and editable regions tabs overlap, making it difficult to see the repeating region name. I've found it handy to use fairly long names for the repeating region, such as dataRowRepeating, and relatively short names for the editable region, such as dataRow, to enable me to see portions of both tabs. Also, although all template regions use the same color established in Preferences, the highlight for a repeating region is significantly lighter than that for editable regions. This color variation makes it much easier to identify the different types of regions.


1. Modifying a repeating region

The power of repeating regions isn't apparent until you open a template-based document containing one. With Invisible Elements enabled, you notice a series of buttons above each repeating region, as shown in Figure 2. With these controls, new entries — identical to the content contained within the repeating region — are added, deleted, or moved from one position to another. You can even copy and paste content within a repeating region.

Figure 2. Entries can be added and removed in a repeating region; they can also be reordered.

To modify a repeating region in a template-based document, follow these steps:

  1. Make sure View => Visual Aids => Invisible Elements is enabled.

  2. Locate the four buttons above the repeating region:

    • To add a new entry, click the Add (+) button. New entries are inserted below the current cursor selection. New entries are selected after they are created.

    • To delete an existing entry, position your cursor in the entry and click the Remove (−) button.

    • To move an entry down, place your cursor in the entry and click the Down button.

    • To move an entry up, place your cursor in the entry and click the Up button.

  3. To copy and paste an entry, follow these steps:

    1. Position your cursor in the entry.

    2. Choose Edit => Repeating Entries => Copy Repeated Entry.

    3. Choose Edit => Paste or Edit => Repeating Entries => Paste Repeated Entry.

If you prefer to work with Invisible Elements off, Dreamweaver provides corresponding menu options under both the main and context menus. In fact, the menu options are, in some ways, more powerful and can be immediate timesavers. Look in the main menu under Modify => Templates => Repeating Entries or, in the context menu under Templates, for these commands:

  • New Entry Before Selection

  • New Entry After Selection

  • New Entry At End

  • New Entry At Beginning

  • Cut Repeating Entry

  • Copy Repeating Entry

  • Delete Repeating Entry

  • Move Entry Up

  • Move Entry Down

  • Move Entry To Beginning

  • Move Entry To End

2. Constructing a repeating table

Repeating regions are used so commonly in tables that Dreamweaver provides a tool to create both a table and a repeating region at the same time. The Repeating Table object opens the standard table dialog box with the added capability to define which rows are within a repeating region. When inserted, the repeating region is all set up — and even includes a separate editable region in each cell, as shown in Figure 3.

To insert a Repeating Table, follow these steps:

  1. In your template open for editing, position your cursor where you'd like the table to appear and choose Insert => Template Objects => Repeating Table. Alternatively, you can drag the Repeating Table icon from the Templates menu of the Insert panel. The Insert Repeating Table dialog box, shown in Figure 4, is displayed.

  2. Enter the values desired for the table attributes: Rows, Columns, Cell Padding, Cell Spacing, Width, and Border.

    Figure 3. The Repeating Table object also includes editable regions for every cell in the repeating region rows.
    Figure 4. With the Repeating Table feature, you can define multiple rows to repeat.
  3. Determine which rows of the table are to be repeated by entering the number of the first row in the Starting Row field and the number of the last row in the Ending Row field. For example, if you want only the second row of the table to repeat, your values are Starting Row: 2 and Ending Row: 2. However, if you want three rows to repeat starting with row 2, the values are Starting Row: 2 and Ending Row: 5.

  4. Enter a unique name for the repeating region in the Region Name field or leave the Dreamweaver-supplied default name.

  5. Click OK when you're finished.

After the table is created, notice that every cell in the designated repeating region is editable. Dreamweaver automatically inserts separate editable regions and names them incrementally EditRegion1, EditRegion2, and so on. By defining each cell as editable, rather than the entire row, Dreamweaver gives you the option to retain the editability on a cell-by-cell basis. If the cell should not be editable, position your cursor anywhere in the cell and choose Modify => Templates => Remove Template Markup.

Applying Additional Editable Regions

In the previous Dreamweaver Technique, you began the process of converting an existing page into a template. This Technique takes the next step and includes editable regions within a table.

  1. Open the file created in the previous Dreamweaver Technique from the Templates folder, template_start.dwt.

  2. You can apply editable regions to more than just text. Images are also good candidates, but first, it's a good idea to create a generic image placeholder. Select the image of the house in the page and delete it.

  3. From the Insert panel's Common category, choose Images: Image Placeholder.

  4. When the Image Placeholder dialog box opens, enter House in the Name field, 325 in Width, and 180 in Height; click OK when you're done.

  5. Select the image placeholder and, from the Property inspector's Class list, choose imageRight.

  6. With the image selected, choose Template: Editable Region.

  7. In the New Editable Region dialog box, enter House Image in the Name field.

  8. Tables are another page element that is easily made template-friendly. Select the value in the table cell next to the Bedrooms label and choose Templates: Editable Region.

  9. In the New Editable Region dialog box, enter Bedrooms in the Name field and click OK.

  10. Repeat Steps 6 and 7 to create editable regions for each of the values in the second column of the table; make your selections and name your editable regions like this:

    SelectionEditable Region Name
    2~HFBathrooms
    1 acreAcres
    2500 sq. ft.Square Feet
    350,000Price



  11. Save your page; click OK to acknowledge that some block content is within an editable region — if desired, you can select the Don't Show Me This Message Again option to avoid this alert in the future.

Editable regions are a cornerstone of the template structure and, as you can see, have a great number of uses.

 
Others
 
- Dreamweaver CS5 : Using Dreamweaver Templates - Making Attributes Editable
- Adobe Photoshop CS5 : Fixing Group Shots the Easy Way
- Adobe Photoshop CS5 : Fixing Reflections in Glasses
- Adobe After Effects CS5 : Color Matching (part 3)
- Adobe After Effects CS5 : Color Matching (part 2) - The Fundamental Technique - Dramatic Lighting & No Clear Reference
- Adobe After Effects CS5 : Color Matching (part 1) - The Fundamental Technique - Ordinary Lighting
- Adobe After Effects CS5 : Color Look Development
- Adobe Fireworks CS5 : Applying the Unsharp Mask Live Filter
- Adobe Fireworks CS5 : Adjusting brightness with the Dodge and Burn tools
- CorelDraw 10 : Adding Graphics to a Page (part 3) - Optimizing images for the Web
 
 
Top 10
 
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
Technology FAQ
- Is possible to just to use a wireless router to extend wireless access to wireless access points?
- Ruby - Insert Struct to MySql
- how to find my Symantec pcAnywhere serial number
- About direct X / Open GL issue
- How to determine eclipse version?
- What SAN cert Exchange 2010 for UM, OA?
- How do I populate a SQL Express table from Excel file?
- code for express check out with Paypal.
- Problem with Templated User Control
- ShellExecute SW_HIDE
programming4us programming4us