Dreamweaver Frames Tutorial
- Single frames may be added to pages that require the functionality in just one spot on the page, such as a navigation bar.
To begin, launch Dreamweaver and create a new file or open an existing one. Using the Dreamweaver toolbar, navigate to "Insert" and then select "Frames" from the "HTML" option. Once selected, choose a specification, such as left or top, to indicate where the frame is placed on the page. Follow the prompt to enter a frame title and then click the "OK" button. This process creates a file for the frame, one for the original document and a third for the HTML file that holds all the pages together.
Next, click the dotted rectangle in the design window, which represents the frame, and go to the "Properties" toolbar. Here, you can edit the format, such as setting a width or adding a border color, for the entire frame. Additionally, you may click on the specific frame tag in the code window to bring up specialized options in the "Properties" toolbar. Select from various enhancements, such as scrolling and dimensions, if desired.
Finally, add content to the frame. Simply click inside the frame in the design window and begin typing and/or inserting data.
Name the three files with unique titles and save each one. For example, the original file might be called "index.html", the document containing all of the files may be "frames.html" and the individual frame can be identified by its purpose like "navigation.html." Use the browser's "Preview" function to check your work. - Framesets are groups of frames that can flow horizontally and vertically. Use the frameset template to insert a layout into a new page.
First, create a new file and go to the "New Document" dialog window. Select the "Page from Sample" option on the left-hand side and then click the "Frameset" choice in the "Sample Folder" column. View the layouts available by clicking on a title under the "Sample Page" section. Each page displays a preview on the right-hand side, with a description of the frameset underneath it.
Continue by picking a "Doctype" from the drop-down menu. The "Doctype" specifies the programming code (HTML or XHTML) and version that a validator verifies the syntax against. These options range from "HTML 4.01 Transitional" to "XHTML Mobile 1.0", with each serving a specific purpose; however, "HTML 4.01 Frameset" and "XHTML 1.0 Frameset" are recommended for pages that use frames. Click the "Create" button and follow the prompts to name the frame file you have just created.
Following, click the dotted line in the design window to select the body of the frame and go to the "Properties" toolbar to format any items required. For example, you can edit column dimensions or border attributes using the drop-down menus and text fields provided. You may also click a specific frame's syntax in the code window to make individual edits. Select from margin sizes, border features and/or scrolling choices to customize each frame, if preferred.
Lastly, click inside a particular frame in the design window to begin adding content and insert any content as you normally would with a single page. After adding the data, name and save each file. Preview your work in a web browser to check the layout.
Add a Single Frame
Use a Frameset Template
Source...