Now you'll modify the template for the product pages to fix the broken navigation bar. Once you've fixed the navigation bar in the template, you'll reapply the template to the product pages so that the navigation bar is updated for all of the pages that use the template.
To open the template file in the Document window:
![]() |
In the Site window, double-click DW2_cat_product.dwt in the Templates folder of the Olivebranch_site folder. |
Each template contains both locked and editable regions. Locked regions can be edited only inside the template itself; they appear in a highlight color on all pages the template is applied to. Editable regions are placeholders for the content that is unique to each page the template is applied to. In a template, the editable regions are highlighted.
![]() |
|
In this template, the navigation bar is in a locked region, while the areas for product photos and text are editable for each product page. |
Now, edit the template file. First, add a link to the catalog graphic.
To add a link from the catalog graphic to the main Catalog page:
1 | Single-click the catalog graphic. |
2 | Choose Window > Properties to open the Property inspector. |
3 | In the Property inspector, click the file folder next to the Link field and select the file DW2_cat_main_index.htm from the Olivebranch_site folder. |
4 | Leave the Property inspector open. |
![]() |
Next, add a graphic in the upper right corner of the page and link it to the Olivebranch home page.
To add a graphic that links to the Olivebranch home page:
1 | Click inside the empty cell to the right of the catalog image. |
2 | Choose Insert > Image and select cat_nav_photos.jpg in the Assets folder. |
The graphic appears in the cell.
![]() |
|
3 | Make sure the graphic you just added to the cell is still selected. (If not, single-click to select it.) |
4 | In the Property inspector, click the file folder next to the Link field and select the file DW2_index.htm from the Olivebranch_site folder. |
5 | Close the Property inspector. |
![]() |
Now that you've edited the template, reapply it to the product pages.
To reapply the template to product pages in the catalog:
1 | Choose File > Save to save your changes. |
2 | When you are asked if you want to update all documents in your local site that use this template, click Yes. |
An Update Pages dialog box appears to display the status of pages in the site as the template is being reapplied. | |
3 | After all files on the site have been updated, close the Update Pages dialog box. |
![]() |
Because the main Catalog page contains links to each of the product pages in the site, you can use it to quickly preview all the product pages you reapplied the template to. Open the main Catalog page in a browser, then click the links to the product pages.
To see updated product pages:
1 | Double-click DW2_cat_main_index.htm in the Site window to reopen it in the Document window. |
2 | Press F12 to preview this page in your primary browser, or chose File > Preview in Browser to select a different browser. |
3 | Click the links for wines, cheeses, mustards, and oils to go to each of the product pages. |
4 | On each product page, click the catalog and Olivebranch home page links you added to the navigation bar to see how the changes you made in the template have been applied to the pages. |
5 | Close the browser when you're finished testing the links in the navigation bar on the product pages. |
6 | Return to Dreamweaver and choose File > Close. |
![]() |