USING THE GOLIVE SOURCE CODE EDITORS | Special Edition Using Adobe Creative Suite 2

GoLive provides access to the source code of your pages in a variety of convenient ways. You can edit source code using the Source tab of the Document window in either full mode, as seen in Figure 38.1, or in split view mode with the Layout tab in the top and the Source code in the bottom, as shown in Figure 38.2.

Figure 38.1. The Source tab of the Document window gives you full-screen access to your source code.

Figure 38.2. The split view mode of the Document window shows both the layout of your web page at the top and the source code at the bottom.

If you like to edit your source code in a floating palette, you can open the Source Code palette, shown in Figure 38.3.

Figure 38.3. The Source Code palette gives you a floating window you can drag around the workspace as you edit your code and view a full-screen layout.

The Source Code Editor can be set up to display the source code in pretty much any format you like; you just have to spend a little time setting it up using the Source Code toolbar, if you're not happy with one of the default settings. See "The Source Code Toolbar," later in this chapter, for details about formatting the source code. See "Setting Source Code Preferences," later in this chapter, for more information about setting up the Source Code Editor the way you like.

The Outline Editor is another way you can work with the HTML source code in your document using an outline format that can be expanded and contracted to make it easier to isolate and work on sections of code, as shown in Figure 38.4.

Figure 38.4. The Outline Editor in the Document window enables you to expand and condense the lines of source code, making it easier to locate and isolate specific areas of code.

The JavaScript Editor is designed to aid you in building scripts and provides all the tools necessary to embed and test a JavaScript in your document, as shown in Figure 38.5. The JavaScript code you create in the JavaScript Editor can be inserted in the <HEAD> section of your HTML code or exported to be used as an external JavaScript.

Figure 38.5. The JavaScript Editor helps you build scripts and provides the tools you need to embed and test a JavaScript in your document.

The Source Code Toolbar

The Source Code toolbar is located at the top of the Source Code Editor within the Source tab. The Source Code toolbar contains tools that affect the way the source code is displayed and also provides tools for checking your code syntax and navigating through the code. GoLive comes with some predefined themes that determine how the source is displayed. You can select these themes in the Source Code toolbar, as shown in Figure 38.6:

Check Syntax: Ensure that your code complies with predetermined formats. See "Checking Syntax," later in this chapter.
Select code formatting theme: Choose a code formatting theme to make the code easier to read and follow. The available themes provide various methods of color coding the code as well as assigning different text sizes depending on how you'd like to look at source code.
Colorize Code: Turn colorized text on and off.
Word Wrap: Wrap the code to fit within the width of the window. All lines after the first are indented.
Display line numbers: Turn on line numbers to make it easier to locate and remember places in the code. The line numbers also help when word wrap is turned on, since the line numbers refer to lines of code and assign a line number to only the first line of a wrapped line.
Navigate through code: Set markers inside the code using the New Marker option in this button's menu and then easily jump to those markers using this same menu.

Figure 38.6. Select a theme that displays the source code in a variety of ways.