With a click of the Code button, you can change to Code view and easily edit the markup and text that define the look and feel of the Web page you are working with. FrontPage 2003 has many features and tools to help make this job easier.
For starters, FrontPage numbers and indents each line of code by default, as shown in Figure 1-6. You can change these code view options using the General tab of the Page Options dialog box. Choose Tools, Page Options, and then select the General tab. You can now use the fields of the Code View Options panel to manage word wrap, auto indent, line numbers, and the selection margin (the spacing between line numbers and code).
If you are working with a page that has lengthy sections of code, you ll find that line numbering is an invaluable tool you frequently use to zero in on a specific line of code to make a change. Regardless of whether or not they are displayed, FrontPage 2003 tracks line numbers, so that you can jump to a specific line of code using the Go To Line dialog box.
To display and use the Go To Line dialog box, press Ctrl+G, or choose Edit, and then Go To Line. Next, type the line number you want to access, and then press Enter.
Other coding features that you ll use frequently include:
Code formatting rules
In Code view, tags, attribute names , attribute values, and other items are color-coded. You have precise control over the color combinations used. To view or modify the color settings, follow these steps:
Choose Tools, Page Options, and then click the Color Coding tab.
Use the color selection options shown in Figure 1-7 to specify the colors you want to apply. If you later want to restore the original color settings, click Reset Colors.
Figure 1-7: Color-code the markup and text of the page to suit your needs.
Click OK when you are finished.
The format of code is important, so FrontPage 2003 applies code formatting according to very specific rules. By default, when FrontPage creates tags, the tag names and their attribute names are lower case. Unlike HTML, where tag and attribute case doesn t matter, you ll find that some other markup languages (including XML and XHTML) require that all tags and attribute names be lowercase. With this default setting, you ll be in good shape if you use these markup languages, or transition to them in the future.
You can view and change the code formatting rules by choosing Tools, Page Options, and then selecting Code Formatting. FrontPage applies these formatting rules only when it generates markup. As Figure 1-8 shows, these rules control:
Tab size , indentation and right margin
Line breaks before and after start and end tags
Whether start or end tags should be omitted when generating tag sets
Figure 1-8: FrontPage uses code-formatting rules when generating markup. You can change these rules at any time.
It s important to note that FrontPage will not modify existing code automatically. If you change the formatting rules, FrontPage does not apply these rules to existing code. If you import or open pages that were created outside of FrontPage, the code formatting rules aren t applied, nor is the code of the page changed in any way. The only time FrontPage might change code within pages is if you elect to optimize pages when publishing them. For more information on the Optimize Published HTML feature, see Chapter 17, Publishing Your Web Site.
When you are in Code view, you can add frequently-used code blocks with a few keystrokes, using the Code Snippets feature. All code snippets have a keyword, description and code block.
|See Also|| |
If you want to learn how to modify existing code snippets or define your own code snippets, see Chapter 10, Editing HTML and XML Markup.
Adds an HTML 2.0 DOC TYPE declaration to the page.
Adds an HTML 3.2 DOC TYPE declaration to the page.
Adds an HTML 4.0 DOC TYPE declaration to the page.
Adds a link relationship tag for specifying an external style sheet.
Adds a meta tag used to specify the page description for search engines.
Adds a meta tag used to specify the keywords for search engines.
Adds a VBScript block with script and comment tags.
You can easily insert code snippets by following these steps:
Press Ctrl+Enter to display a shortcut menu that lists all the available code snippets by keyword and description.
Once the shortcut menu is displayed, type the keyword or select the code snippet you want to use.
Press Tab or Enter.
Use Code Snippets to Learn Faster