- Introduction
- Understanding HTML
- Using the Reference Panel
- Using Code View
- Using Code Live View
- Setting Code View Options
- Entering HTML Code
- Using Code Hints
- Working with HTML Head Tags
- Inserting HTML Comments
- Using the Coding Toolbar
- Using Quick Tag Editor
- Using the Tag Inspector
- Using the Tag Chooser
- Opening Related Files
- Navigating to Related Code
- Setting Site Specific Code Hints
- Setting Code Hint Preferences
- Setting Code Format Preferences
- Setting Code Rewriting Preferences
- Setting Code Color Preferences
This chapter is from the book
This chapter is from the book
This chapter is from the book
Using the Coding Toolbar
When you switch to Code or Split view, the Coding toolbar appears along the left side of the Code view pane. The toolbar provides easy access to the most common coding related commands. If the Code view pane is not large enough, an expander arrow appears, which you click to access additional buttons. Some of the tools allow you to collapse and expand the content between a set of opening and closing tags, select tags, insert and remove comments, format code, and highlight invalid code.
Use the Coding Toolbar
Open the Web page you want to view code.
Switch to Code or Split view.
Click to place the insertion point in the code or select a block of code.
Click the button you want on the Coding toolbar:
-
Open Documents. Displays a list of open documents. Click the one you want to open it.
-
Show Code Navigator. Displays the Code Navigator in the code.
-
Collapse Full Tag. Collapses the content between a set of opening and closing tags. You need to place the insertion point in the opening or closing tag.
-
Collapse Selection. Collapses the selected code.
-
Expand All. Restores all collapsed code.
-
Select Parent Tag. Selects the code tag immediately outside of the line with the insertion point.
-
Balance Braces. Selects the code tag and surrounding parentheses, braces, or square brackets of the line with the insertion point.
-
Line Numbers. Shows or hides the numbers at the beginning of each line of code.
-
Highlight Invalid Code. Highlights invalid code in yellow.
-
Syntax Error Alerts in Info Bar. Displays syntax code error alerts in the Info bar.
-
Apply Comment. Inserts comment tags around the selected code, or opens new comment tags.
-
Remove Comment. Deletes comment tags from the selected code.
-
Wrap Tag. Wraps selected code with the selected tag from the Quick Tag Editor.
-
Recent Snippets. Inserts a recently used code snippet from the Snippets panel.
-
Move or Convert CSS. Moves CSS to another location or converts inline CSS to CSS rules.
-
Indent Code. Shifts the selection to the right.
-
Outdent Code. Shifts the selection to the left.
-
Format Source Code. Displays options to apply source code formatting to selected code, or to the entire page if no code is selected. You can also access Code Format Settings from the Preferences dialog box or the Tag Library Editor.
-
)
)