ptg 440 Chapter 18 Creating InContext Editing Repeating Regions Create an InContext Editing Repeating Region Open the Web page that you want to transform into an ICE editable region. Do any of the following to select the region that you want to make editable: ◆ Select any of the following tags: a, abbr, acronym, address, b, bif, blockquote, center, cite, code, dd, dfn, dir, dive, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, li, menu, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tr, tt, u, ul, and var. ◆ Place the insertion point or select content. ◆ Select one editable region in a template. Click the Insert menu, point to InContext Editing, and then click Create Repeating Region. Based on your selection in Step 2, take the appropriate action: ◆ If you selected a tag, you’re done. 4 3 2 1 In addition to creating an editable region, you can also create a repeat- ing region for use with Adobe InContext Editing (ICE), an online service that allows users to make simple edits to your web pages without any previous knowledge of HTML code or web editing. An ICE repeating region creates an area on the page that a user can repeat and add content. When you create an ICE repeating region, Dreamweaver adds a pair of HTML tags that includes the ice:repeating attribute in the opening tab. To edit a page, a user opens the page in a browser, logs in to the InContext Editing service, and then edits the content in the ICE repeating region. If you are creating an ICE repeating region to a tem- plate, the new ICE editable region must be placed within an editable region. For details about using the Adobe ICE online editing service, see the Adobe web site at www.adobe.com . 1 2 3 4 From the Library of Wow! eBook ptg Chapter 18 Creating Templates 441 ◆ If you placed the insertion point or selected content, select an option to create a new editable region, and then click OK. ◆ If you selected one editable region in a template, click OK. Click the blue tab of the editable region to select it. Specify the editing options that you want to make available to users in the Properties panel. The options you select in the Properties panel will be available to users when they edit the page in a browser. Click the File menu, and then click Save. If prompted, click OK for Dreamweaver to add supporting files to your site for ICE. These files need to be uploaded to your server for ICE to work properly. 8 7 6 5 7 5 6 From the Library of Wow! eBook ptg 442 Chapter 18 Creating Nested Templates Create a Nested Template Create a normal template, the same as any other template. This template will act as the parent template. There must be at least one editable region in the template (this is the area you will insert your nested template). Click the File menu, and then click Save As Template. Save the template using the following options: ◆ Site. Choose the site to save the template (default: working site). ◆ Description. Enter a meaningful description of the template. ◆ Save As. Enter a file name for the template. Click Save. Click Yes as necessary to update the site with any needed files. Click the File menu, click Close, and then click OK as necessary to the alert message. 6 5 4 3 2 1 Nested templates are essentially templates within templates. Nested templates allow for different levels of control on pages created from these templates. For example, you create a Web site that has a similar overall appearance (navigation, logo, color scheme, etc.), yet also has sections that have a different appearance. For the separate sections of the site, you can make nested templates that will have common ele- ments and layout features for that section. The differences represent a different type of page in the site. First, you create the navigation tem- plates; each with their own differences, and save them. Next, you cre- ate the main body of the page (which will also be a template), and "nest” the navigation template into the main template. The nested tem- plate is now defined as the "child" template. Now, any time you need to make changes to the navigation, you simply edit the child template, just like any other template, and the changes will be applied specifically to the pages that contain the child. Nested templates do not increase the size of the Web page, nor do they create any additional complexity. All they do is give you control over your site. 5 4 3 From the Library of Wow! eBook ptg Chapter 18 Creating Templates 443 Now, you want to create a new page based on the template. Click the File menu, and then click New. Select from the following options in the New Document dialog box: ◆ Click the Page From Template category. ◆ Select the site where the template is located. ◆ Select the template you just saved in step 4. ◆ Click Create to open the new document. Click to select the area of the document that will contain the nested template. Click the Window menu, and then click Assets to display the Assets panel. Click the Templates category. Select your previously created nested template (in this example, a template that contains the navigation). Click the Apply button in the Assets panel. Dreamweaver adds the nested template to this new document. Click the File menu, click Save As Template, and then follow the instructions in steps 3 through 5 to save this template. 14 13 12 11 10 9 8 7 8 Dealing with Inconsistent Region Names The Inconsistent Region Names dialog box appears automatically when Dreamweaver finds regions that do not match in a template and the document to which the template is being applied. You can map the content in the document to any region in the template or discard the content. For Your Information See Also See “Setting Highlighting Color Preferences” on page 66 for informa- tion on setting highlight colors for editable regions, nested editable regions, and locked regions. From the Library of Wow! eBook ptg 444 Chapter 18 In addition to standard templates, you can create nested templates. A nested template is a template whose design is based on another tem- plate. By creating nested templates, you can control content in pages that share the same layout but also have slight design variations. When you open and change a nested template, it modifies that section of all the files that use the nested template without changing any other areas of the template or the pages to which they are attached. This takes Web page customization and reusability to the next level. Creating a Web Page from a Nested Template Create a Nested Template Click the File menu, and then click New. The New Document dialog box opens. Click the Page From Template category. Select the site that contains the template you want. Select the template you want to use. Click Create. Dreamweaver opens a new Web page based on the selected template. Add something to the new template, such as a pre-existing navigational system, an image, or possibly some changeable text. Click the Insert menu, point to Template Objects, and then click Make Nested Template. Enter a Description in the input field (optional), and then enter a name for the nested template into the Save As input field. Click the Save button. Dreamweaver now saves the nested template. 9 8 7 6 5 4 3 2 1 5 2 3 4 9 8 From the Library of Wow! eBook ptg Chapter 18 Creating Templates 445 Creating a Web Page from a Custom Template Create a Web Page from a Custom Template Click the File menu, and then click New. The New Document dialog box opens. Click the Page From Template category. Select the site that contains the template you want. Select the template you want to use. Select the Update Page When Template Changes check box to instruct Dreamweaver to update all pages when the template changes (default). Click Create. Dreamweaver generates a new document based on the selected template. Edit and add content to all editable areas of the page. Click the File menu, click Save, select a location, specify a name, and then click Save to save your new page. 8 7 6 5 4 3 2 1 After you create your own custom template, you can use it to create Web pages. A document created from a template is known as an instance of that template. When you create a page based on a tem- plate, it contains all the attributes of the template; however, it won't be a template, it will be a Web page. When you open a page based on a template, the editable regions in Design view appear with a rectangular outline and a small tab in the upper-left corner with the name of the region. You can click the tab to select the editable region. In addition, the entire page is surrounded by a different colored outline with the template name on the tab that reminds you the page is based on a tem- plate and you can only change editable areas. 6 2 4 3 5 From the Library of Wow! eBook . Create Repeating Region. Based on your selection in Step 2, take the appropriate action: ◆ If you selected a tag, you’re done. 4 3 2 1 In addition to creating an editable region, you can also create. Information See Also See “Setting Highlighting Color Preferences” on page 66 for informa- tion on setting highlight colors for editable regions, nested editable regions, and locked regions. . 441 ◆ If you placed the insertion point or selected content, select an option to create a new editable region, and then click OK. ◆ If you selected one editable region in a template, click OK. Click