Macromedia GoLive - CS Instruction Manual

3 T

•

2 L

3 T

dob e G oLiv e CS H elp

sing H elp | C on t en ts | Inde x

ack

sing H elp

U sing Help

bout Help

dobe Systems Incorporated provides complete documentation in an Adobe PDF-based help system. This help system includes information on all tools, commands, and features of an application. It is designed for easy on-screen navigation and can also be printed and used as a desktop reference. Additionally, it supports third-party screen-reader applica tions that run in a Windows environment.

avigating in Help

elp opens in an Adobe Acrobat window with the Bookmarks pane open. (If the Bookmarks pane is not open, click the Bookmarks tab at the left edge of the window.) At the top and bottom of each page is a navigation bar containing links to this page (Using Help), the table of contents (Contents), and the index (Index).

To move through pages sequentially, you can click the Next Page and the Previous Page arrows; click the navigation arrows at the bottom of the page; or click Back to return to the last page you viewed.

You can navigate Help topics by using bookmarks, the table of contents, the index, or the Search (Acrobat 6) or Find (Acrobat 5) command.

o ﬁnd a topic using bookmarks:

n the B ookmarks pane, click the plus sign (+) (Windows) or the right-facing arrow

(Mac OS) next to a bookmark topic to view its subtopics.

lick the b ookmark to go to that topic.

o ﬁnd a topic using the table of contents:

lick C ontents in the navigation bar.

On the C ontents page, click a topic to go to that topic.

o view a list of subtopics, click the plus sign (+) (Windows) or the right-facing arrow

(Mac OS) next to the topic name in the Bookmarks pane.

o ﬁnd a topic using the index:

o one of the f ollowing:

lick Index in the navigation bar, and then click a letter at the top of the page.

n the B ookmarks pane, expand the Index bookmark to view the letter subtopics;

then click a letter.

ocate the entry you want to view, and click the page number to go to that topic.

o view other entries for the same topic, click Back to return to the same place in the

index, and then click another page number.

sing H elp | C on t en ts | Inde x

ack

2 T

3 T

dob e G oLiv e CS H elp

sing H elp | C on t en ts | Inde x

o ﬁnd a topic using the Search command (Acrobat 6):

1 C hoose Edit > Search.

ype a word or phrase in the text box and click Search. Acrobat searches the document and displays every occurrence of the word or phrase in the Results area of the Search PDF pane.

o ﬁnd a topic using the Find command (Acrobat 5):

1 C hoose Edit > Find.

ype a word or phrase in the text box and click Find. Acrobat searches the document, starting from the current page, and displays the ﬁrst occurrence.

o ﬁnd the next occurrence, choose Edit > Find Again.

ack

sing H elp

rinting Help

lthough Help is optimized for on-screen viewing, you can print selected pages or the

entire ﬁle.

o print Help:

hoose File > Print, or click the Print icon in the Acrobat toolbar.

sing H elp | C on t en ts | Inde x

ack

C on t en ts

dob e G oLiv e CS H elp

sing H elp | C on t en ts | Inde x

ontents

earning about Adobe GoLive CS 4

What’s New in GoLive CS 8

Tutorials 11

Looking at the Work Area 28

Setting up Sites and Pages 46

Creating Site Diagrams 72

Managing and Viewing Web Sites 91

Laying Out Pages 134

Working with Tables 165

ack

Formatting Text 185

Using Cascading Style Sheets 212

Adding Images and Multimedia 235

Adding Content from Adobe Applications 261

Creating Forms 294

Working with Site Assets 304

Transferring Files and Publishing Web Sites 323

Creating and Maintaining Co-Author Sections 339

Working with PDF Documents 346

Authoring Wireless Web Sites 354

Working with Source Code 375

Using Actions 414

Using Web Settings 448

GoLive Extensibility 462

Keyboard Shortcuts 463

Legal Notices 470

sing H elp | C on t en ts | Inde x

ack

dob e G oLiv e CS H elp

sing H elp | C on t en ts | Inde x

ear ning ab out A dob e G oLiv e CS

ack

Learning about Adobe GoLive CS

Getting help

There are a number of ways to get the help you need in GoLive CS. The following three tables can help you ﬁnd speciﬁc resources related to GoLive features, training resources, and support.

Finding Help for GoLive features

If you . . . Try this . . .

Want information about installing GoLive

• Insert the Adobe GoLive CD into your CD drive, and follow the

on-screen installation instructions (you cannot run the GoLive application from the CD).

• See the HowToInstall ﬁle on the Adobe GoLive CD.

Are new to GoLive and want an overview of tools and features

Are upgrading from a previous version of GoLive

Are looking for detailed information about a feature

Want information about authoring QuickTime or SMIL ﬁles.

Want a complete list of keyboard shortcuts

• Browse through the information in “Working with Adobe GoLive”

on page 6 for information on speciﬁc tasks.

• Choose Help > GoLive Help. Then select “Looking at the Work Area”

from the links on the Contents tab.

• Move the pointer over a tool or button to display the tool or button

name.

• Try the beginning tutorials in GoLive Help.

Go to the “What’s New in GoLive CS” chapter to get an overview of new features, or see the NewFeatures.pdf ﬁle in the GoLive application folder for more detailed information.

In GoLive Help, use the index, or search for the feature.

See the Adobe GoLive CS Multimedia Authoring Guide (English only) in the GoLive section of Adobe Studio at www.studio.adobe.com.

Look at the “Keyboard Shortcuts” on page 463.

sing H elp | C on t en ts | Inde x Back 4

Adobe GoLive CS Help Learning about Adobe GoLive CS

Using Help | Contents | Index Back 5

Finding GoLive training resources

If you . . . Try this . . .

Want to obtain in-depth GoLive training

Are looking for background information on Web design

Want information about using third-party products provided with GoLive

Want information about extending the functionality of GoLive

Want to access the Developer Knowledgebase or software developer kits (SDKs)

Want information about becoming an Adobe Certiﬁed Expert

• See the tutorials on the Adobe Studio Web site

at www.studio.adobe.com.

• Browse the Adobe Press materials at www.adobepress.com

(English only), and the available training resources at www.adobe.com/support/training.

• For step-by-step lessons, consider the Adobe Classroom in a

Book series.

• For in-depth reference information, consider the RealWorld series.

See the Adobe Press section of the Adobe Web site at www.adobe.com/misc/books.html.

Look in the Partners folder on the Adobe GoLive CD.

Look at “GoLive Extensibility” on page 462.

See the Adobe Solutions Network (ASN) section of the Adobe Web site at http://partners.adobe.com/asn/golive/ (English only).

Visit the Partnering with Adobe Web site at www.partners.adobe.com. Certiﬁcation is available for several different geographical regions.

Want training from an Adobe Certiﬁed Training Provider

See the Training page of the Adobe Web site at www.adobe.com/misc/training.html

Finding support for GoLive

If you . . . Try this . . .

Want customer or technical support

• Refer to the technical support card provided with your software.

• Register GoLive and receive technical support for up to 90 days

from the date of your ﬁrst call (terms may vary depending on country of residence).

• See the Adobe GoLive support page

at www.adobe.com/support/products/golive.

• Read the ReadMe ﬁle installed with GoLive for information that

became available after this guide went to press.

Want answers to common troubleshooting questions

Search the Adobe Support Knowledgebase and GoLive Top Issues at www.adobe.com/support/products/golive.

Using Help | Contents | Index Back 5

Adobe GoLive CS Help Learning about Adobe GoLive CS

Using Help | Contents | Index Back 6

Finding support for GoLive

If you . . . Try this . . .

Want to register your copy of GoLive

Want access to a multitude of GoLive speciﬁc information, such as downloads, updates, patches, plug-ins, and links to user forums

• When you ﬁrst start GoLive, you’re prompted to register online. Fill

out the form, and then submit it directly or fax a printed copy.

• Fill out and return the registration card included with your soft-

ware package.

• Access the online registration form at any time by choosing

Help > Registration.

Visit the GoLive pages on Adobe Studio at www.studio.adobe.com.

Working with Adobe GoLive

You can work with GoLive in many different ways. In the related topics, you’ll ﬁnd directions to speciﬁc information to help you accomplish some common GoLive tasks.

If you want consistent design throughout a site

• Apply page templates to present a uniform look and feel.

(“Using page templates” on page 305.)

• Create components to automatically update navigation bars and other design

elements that appear on multiple pages. (See

• Use Cascading Style Sheets (CSS) to apply identical text styles throughout a site.

(See “About cascading style sheets” on page 212.)

• Create co-author sections, which let editors and writers update content by using a

simple form-like interface. (See

“Creating co-author sections” on page 339.)

“Using components” on page 311.)

If you want to increase productivity

• Add pre-built snippets of commonly used HTML and JavaScript code.

(See “Using snippets” on page 313.)

• Group ﬁles in collections to speed up common ﬁle management tasks.

(See “Using collections” on page 319.)

• Use enhanced source code features to automatically compare, ﬁnd, and complete code.

(See

“Using the GoLive source code editors” on page 375.)

• Update links site-wide with the In & Out Links palette.

(See “Using the In & Out Links palette to view links” on page 124.)

If you want to work with other Adobe tools

• Use Smart Objects to import and optimize native Adobe Photoshop

trator®, and Adobe Acrobat® ﬁles. (See “Working with Smart Objects” on page 262.)

• Import and edit Adobe ImageReady

rollovers. (See “Importing rollovers from

ImageReady” on page 244.)

Using Help | Contents | Index Back 6

, Adobe Illus-

Adobe GoLive CS Help Learning about Adobe GoLive CS

Using Help | Contents | Index Back 7

• Fully integrate Adobe PDF documents into Web sites.

(See “About working with PDF documents” on page 346.)

• Import GoLive packages from Adobe InDesign

designs. (See

• Manage projects with Adobe Version Cue

version-control features. (See

“Adding InDesign content” on page 286.)

“Working with Adobe Version Cue managed projects” on

to quickly match related print and Web

to provide workgroups with powerful

page 45.)

If you want to import content from non-Adobe applications

• Add GIF, JPEG, PNG, and WBMP images to Web pages. (See “Adding pre-optimized

images” on page 235.)

• Open exported HTML ﬁles by using the File > Open command.

• Create a new site from a folder of HTML ﬁles by using the Site Wizard's Import from

Folder feature. (See

• Import tab-delimited text from a spreadsheet or database into a GoLive table.

(See “Adding text to tables” on page 182.)

“Creating a single user site” on page 47.)

Using Help | Contents | Index Back 7

Adobe GoLive CS Help What’s New in GoLive CS

Using Help | Contents | Index Back 8

What’s New in GoLive CS

Work with industry-leading Adobe technology

GoLive CS offers unparalleled integration with Adobe products like Adobe Acrobat, Adobe Photoshop, Adobe InDesign, and Adobe Version Cue.

Adobe PDF Adobe Portable Document Format (PDF) is a worldwide standard for secure and reliable transmission of electronic documents over the Web. GoLive CS offers more comprehensive PDF support than any other Web-publishing application. You can preview Web pages in PDF and export them with all formatting, links, and graphics intact. You can also open existing PDF documents to create and edit PDF links and bookmarks. (See

“About working with PDF documents” on page 346.)

Smart Objects With Smart Objects, you can work with native Photoshop, Illustrator, and Acrobat ﬁles directly in GoLive. When you modify a Smart Object, GoLive automatically reoptimizes it for the Web, helping you work more efﬁciently. New Smart Object features include cropping, site-wide updating of Smart Objects edited outside of GoLive, and full support for ImageReady-generated JavaScript code. (See

on page 262.)

Adobe InDesign You can quickly match related print and Web designs by using InDesign’s Package for GoLive feature. These packages let you easily transfer text, graphics, and multimedia assets from InDesign to GoLive. If a print design changes in the future, simply re-create the package in InDesign to update related assets throughout a GoLive site. (See

Adobe Version Cue Use Adobe Version Cue features in Adobe GoLive CS to increase your productivity when you work alone or collaborate with others. You can integrate GoLive design management into your existing workﬂows within and across the Adobe Creative Suite applications. The Version Cue features in GoLive CS are compatible only with the Adobe Version Cue Workspace, available only as part of the Adobe Creative Suite. (See

“Working with Adobe Version Cue managed projects” on page 45.)

Adobe color engine GoLive CS shares the color engine used by Photoshop, Illustrator, InDesign, and Acrobat. This shared color engine lets you use one set of controls to achieve consistent color across Adobe applications and a variety of output devices. (See

“Managing color in images” on page 248.)

“Adding InDesign content” on page 286.)

“Working with Smart Objects”

Enhance your productivity

With a familiar Adobe interface and many other productivity enhancements, GoLive CS streamlines common Web workﬂows.

Adobe interface GoLive CS includes a familiar interface from Adobe products like Photoshop and Illustrator. You can zoom in to reﬁne page layouts with pixel-level precision, use a vertical Objects palette, and collapse palettes to free up screen space for large, detailed Web designs.

Using Help | Contents | Index Back 8

Adobe GoLive CS Help What’s New in GoLive CS

Using Help | Contents | Index Back 9

Streamlined color workﬂow With the Color and Swatches palettes, you can apply color

with a single click, store commonly used colors, and search for colors by name or hexadecimal value. (See

Pre-built design elements To help you quickly complete common Web design tasks, GoLive CS includes a large number of professionally-made design elements in a new Library palette. Choose from pre-built Web pages, Section 508-compliant designs, CSS styles, and JavaScript snippets for cookies, event handlers, and more.

Co-author sections In GoLive sites, Web professionals can now create special co-author sections, which let editors and writers update content by using a simple form-like interface. These template-driven sections ensure a consistent look and feel throughout a site, while letting co-authors with little knowledge of Web design create sophisticated Web content. (See

Queries Expanded search functionality lets you build and save complex queries. You can search for items ranging from HTML elements to site assets and errors. To perform complex searches, deﬁne nested queries; for simple searches, use predeﬁned queries. (See

“Generating queries” on page 129.)

Collections To speed up common ﬁle management tasks, you can create site-speciﬁc collections, which let you quickly select groups of related ﬁles. You can attach queries to collections, ensuring that they include all ﬁles that meet speciﬁc search criteria. (See

“Using collections” on page 319.)

“Using color” on page 67.)

“Creating co-author sections” on page 339.)

Use powerful tools that support industry standards

GoLive CS ensures that your sites meet the latest Web standards.

Enhanced CSS workﬂow In the new CSS editor, you can visually preview styles as you change style properties, drag and re-sort style elements, and view related CSS code. You can also quickly apply styles in the Layout Editor by using new CSS commands in the Type menu. (See

JavaScript rollovers The new Rollovers & Actions palette lets you create sophisticated rollovers with ease. You can combine self and remote rollovers and specify trigger objects ranging from images to text and table cells. GoLive CS also fully supports ImageReady JavaScript code. (See

Revised source code editor GoLive CS includes a completely revised source code editor, which lets you easily select entire HTML elements, complete code automatically, and optimize hand-coded HTML. Customizable syntax coloring helps you easily identify different code types. And new code compare and query features ensure consistent HTML throughout a site. (See

Publish servers With publish servers, you can maintain a site in one, central location, but publish to multiple servers using different transfer protocols such as WebDAV or FTP. The streamlined publish server interface lets you quickly conﬁgure and access servers, so you can focus more energy on Web design. (See

page 325.)

“About the GoLive CSS workﬂow” on page 213.)

“Creating rollovers” on page 240.)

“Using the GoLive source code editors” on page 375.)

“About GoLive publish server clients” on

Using Help | Contents | Index Back 9

Adobe GoLive CS Help What’s New in GoLive CS

Using Help | Contents | Index Back 10

Updated QuickTime and SMIL features Among Web design applications, only GoLive

CS provides a full authoring environment for QuickTime movies. You can create interactive content with wired actions and integrate movies with XML databases. If you own QuickTime Pro, you can also produce 3GPP-compatible ﬁles for wireless devices. GoLive CS provides similarly extensive support for SMIL, letting you design RealOnePlayer and MMS documents with an intuitive, visual interface. For more information, see the

CS Multimedia Authoring Guide

, available on the Adobe Web site.

Adobe GoLive

Using Help | Contents | Index Back 10

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 11

Tutorials

About these tutorials

The following tutorials provide a quick tour of the basic Adobe GoLive CS features. Before you get started, be sure you are familiar with the basic concepts of GoLive. (See

basics” on page 28.)

As you work through these tutorials, you may have new ideas and questions. To assist you with learning GoLive, Adobe provides a variety of resources. For more information, see

“Getting help” on page 4.

For more advanced GoLive tutorials, visit the Adobe Web site at www.adobe.com/ products/tips/golive.html.

“GoLive

Create and structure a site

Adobe GoLive CS makes it easy to create complex, multipage Web sites using the site wizard and the site diagram feature. The site wizard walks you through the process of setting up a new Web site, and the site diagram feature lets you quickly prototype the site, and then convert the prototype to actual pages.

In the steps that follow, you’ll use the site wizard, diagramming tools, and the site window to create a new Web site with multiple pages and folders.

1. Create a new blank site.

Start GoLive and click the New Site button to open the Site Wizard. Select the Single User option, and click Next. In the next screen, select Blank Site, and then click Next. Enter a name for your site in the Site Name text box, click Next, and then specify a location on your hard drive to store the site ﬁles and folders. Click Finish to create the new site. That’s all there is to creating a new site.

Using Help | Contents | Index Back 11

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 12

GoLive creates a project folder on your hard drive. This folder contains the site’s project ﬁle, a web-content folder, which contains an index.html ﬁle, a web-data folder, and a websettings folder, which GoLive uses to manage the site and its assets.

2. Create a diagram and add a page.

With the site window active, choose Diagram > New Diagram to create a new diagram. Drag a Page icon from the Diagram set of the Objects palette to the design view to add a new page named

untitled.html. Click the page’s name, and then enter a new name, such as

Products.html.

Using Help | Contents | Index Back 12

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 13

3. Add new child pages.

With the page in the design view selected, choose Diagram > New Pages. In the New Pages dialog box, enter the number of new child pages to create a base ﬁlename for the new pages. For example, enter Filenames text box to add pages named

4 to create four pages, and then enter Models in the

Models.html, Models1.html, Models2.html, and

Models3.html. Click Create.

4. Anchor the diagram to a page in the site.

Drag the index.html page from the Files tab of the site window to the design view. Index.html becomes an anchor page in the diagram and is indicated by an anchor symbol.

Anchoring the diagram speciﬁes the diagram’s location in the site’s hierarchy.

Using Help | Contents | Index Back 13

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 14

5. Submit the diagram to the site.

Choose Diagram > Staging > Submit All. GoLive converts the diagram’s pages to HTML pages in the site. In the Files tab of the site window, you can see the new pages in the site.

6. Structure the site.

Organize your pages and images in separate folders so that you can keep track of ﬁles and update them easily. With the Files tab of the site window active, click the Create New Folder button

in the toolbar. Rename the new untitled folder Pages. You’ll place all your HTML pages in this folder. Click in an empty area of the Files tab and click the Create New Folder button. Rename the new folder Images. You’ll place all your images in this folder. Select Products.html and its child pages (models.html, models1.html, etc.), and drag them into the Pages folder (Shift-click to select multiple ﬁles).

If your site is very complex, you may want to create subfolders within these folders to easily organize your ﬁles. Whenever you move, rename, or add pages, or create a new folder in the Files tab, GoLive automatically makes the change in the site’s web-content folder.

Using Help | Contents | Index Back 14

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 15

Design and lay out a Web page

Adobe GoLive makes it easy to design and lay out visually compelling Web pages. You can create simple or complex professional-quality Web pages without writing any code.

Once you’ve designed your page, you can save it as a page template. New pages created from a page template remain linked to the template—when you change the template, GoLive automatically updates the pages without affecting any content that has been added to them.

1. Set page dimensions and add a layout grid.

Open a site, and choose File > New Page. (For information about creating a site, see

“Creating a site” on page 46.) Choose 720 from the menu at the bottom right of the

document window to display the current page at 720 pixels wide, the standard width for 17-inch monitors. Drag the Layout Grid icon the page. Type 720 in the Width text box in the Layout Grid Inspector to match the layout grid to the width of the page.

from the Basic set of the Objects palette to

Using Help | Contents | Index Back 15

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 16

Setting a default page size helps prevent you from adding objects, such as large graphic banners, that are too wide to display on a standard page. Layout grids let you create tablebased designs without having to deal with rows, cells, and columns. Layout grids automat ically lengthen to accommodate the objects you place on them.

2. Add a background color to the page.

Click the Show Page Properties icon in the upper right corner of the document window. In the Page tab of the Page Inspector, select Background Color and click the lower right corner of the color ﬁeld. Choose a background color for your page from the list of swatches that appear.

You can apply a color or an image to the background of your page to visually enhance it. Although colors that you choose for page backgrounds override the default colors used by most Web browsers, viewers can change browser preferences to override your page background colors. You can also select an image for the page background, but keep in mind that Web browsers treat the image as a tile and repeat it to cover the entire page.

Using Help | Contents | Index Back 16

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 17

3. Add a text box and format the text.

Drag the Layout Text Box icon from the Basic set of the Objects palette to the layout grid. Move the pointer over the edge of the text box until it changes into a double arrow, and then drag until the box is the size you want. Click inside the layout text box to create an insertion point and type some placeholder text. On the toolbar, click the Align Center button, and then choose Header2 from the Set Paragraph Format menu.

In GoLive, you can format text in a variety of ways: use paragraph styles, such as Header 1 and Header 2, to format paragraphs; use physical styles, such as Bold and Italic, to emphasize text; and use structural styles, such as Emphasis and Strong, to both emphasize and classify text. (For more information about formatting text, see

“About formatting HTML text” on page 185.) You can also apply fonts, type sizes, and color to text using CSS

(cascading style sheets), which contain a set of stylistic rules that describe how HTML documents should appear to viewers. If you need to update a CSS style, you simply edit the style rule and all content that hosts the style will automatically reﬂect the new properties. For more information about CSS, see

“About cascading style sheets” on

page 212.

4. Add a pre-optimized image.

Drag an Image icon from the Basic set of the Objects palette to the layout grid. Select the image object in the document window, and drag the pick whip in the Basic tab of the Image Inspector to a GIF or JPEG ﬁle in the site window. You’ve successfully made the connection when the line from the pick whip connects with and highlights the ﬁlename in the site window. Don’t worry if you don’t have a GIF or JPEG ﬁle in your site: you can link an image ﬁle to the image object in the document window at any time.

Using Help | Contents | Index Back 17

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 18

The standard image formats for the Web are GIF and JPEG. GIF images are typically used for line art, and JPEGs are typically used for photographs and other images with more than 256 colors. For information about choosing an image format, see

optimized images” on page 237,

“Choosing a format for

5. Save the ﬁle as a page template.

Choose Save As > Save As Template from the document window menu in the upper right corner of the document window. Type a name for the template in the Save As dialog box, and click Save.

Page templates are predesigned page layouts that you can use as the basis for new pages. When you update a template, you automatically update all pages based on that template. For more information about templates, see

“Using page templates” on page 305.

Create and manage links

In this tutorial you’ll create navigational links from which viewers can jump to other pages in your site (internal links) or to other sites on the Web (external links).

Adobe GoLive’s powerful site management features make it easy to maintain links between pages, and because GoLive collects and updates URLs in the External tab of the site window, you can quickly create links across the Web.

Using Help | Contents | Index Back 18

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 19

1. Create an internal link.

Open a GoLive site, and then open the page that you want to serve as the source of the link. Select a short block of text and click the Create Link button

in the toolbar. In the

Text Inspector, drag the pick whip to the destination page in the site window.

You can also create internal links by using the Inspector’s Browse button to locate a page, or by typing the relative path to the page in the Inspector’s URL text box. It’s best, however, to use the pick whip when creating links to avoid mistakenly linking to pages outside of the site’s web-content folder.

2. Test the link.

Click the Preview in Browser button in the toolbar to preview the page containing the link in your Web browser. Click the link and make sure that the destination page appears in the browser window.

3. Update the internal link.

With the Files tab of the site window active, click the Create New Folder button in the toolbar. Drag the link’s destination page into the new folder. GoLive displays the Move Files dialog box, which lists the page that serves as the source of the link, and prompts you to update the ﬁle. Click OK.

Using Help | Contents | Index Back 19

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 20

GoLive updates links in your site when you move or rename ﬁles in the site window. To avoid broken links in your site, perform all such site management tasks in the GoLive site window, not directly in your site’s web-content folder in Windows Explorer or the Mac OS Finder.

4. Add a URL to the External tab of the site window.

Drag the URL icon from the Site set of the Objects palette to the External tab of the site window. Rename the untitled URL

Adobe URL. Type http://www.adobe.com in the URL

text box of the Reference Inspector.

The External tab of the site window contains URLs and e-mail addresses. Storing a URL in the External tab is useful when you want to use the URL on more than one page in your site. If you later need to update a URL in the External tab, GoLive automatically updates it wherever it appears in the site.

Using Help | Contents | Index Back 20

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 21

5. Create an external link.

Open the page that you want to serve as the source of the link. Select a short block of text, and click the Create Link button in the toolbar. In the Text Inspector, drag from the pick whip to the Adobe URL in the External tab of the site window.

6. Test the link.

Click the Preview in Browser button in the toolbar to preview the page containing the link in your Web browser. Click the link and make sure that the Adobe Web site appears in the browser window.

7. Update the external link.

Select the Adobe URL in the External tab of the site window. Type http:// www.adobe.com/products/golive/ main.html

in the URL text box of the Reference Inspector, and then press Enter (Windows) or Return (Mac OS). GoLive displays the Change Reference dialog box, which lists the page that serves as the source of the link, and prompts you to update the ﬁle. Click OK to update the reference.

GoLive provides other tools for updating internal and external links. For example, to edit links sitewide, use the In & Out Links palette or the Change References dialog box (see

“Editing links and URLs sitewide” on page 124).

Using Help | Contents | Index Back 21

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 22

Create a print-friendly PDF version of a Web page

With GoLive’s PDF features, you can quickly view, edit, and export PDF ﬁles. This powerful functionality lets you easily create interactive PDF forms, archive Web pages, and more.

In this tutorial, you’ll create a print-friendly version of a Web page, while retaining features such as links and tables.

1. Preview as PDF.

In GoLive, open the Web page that you want to export to PDF, and then click the PDF Preview tab in the document window. If you need to optimize the appearance of items such as type or tables, click the Layout tab, make the necessary changes, and then return to the PDF preview to see the results.

Using Help | Contents | Index Back 22

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 23

2. Format the pages.

In the PDF Creation Inspector, click the Page tab, and set the paper size, margins, and orientation. Then select Shrink Content to Paper Width, and click re-create PDF to see the results.

Shrink Content to Paper Width reduces Web content so it ﬁts on the selected paper size.

3. Optimize for printing.

To ensure that the exported PDF ﬁle works well when printed, click the Creation tab and select Embed Fonts and Hide Backgrounds. Click re-create PDF again to see the results.

Embed Fonts includes fonts in the exported ﬁle, ensuring that text always looks as expected. Hide Backgrounds replaces Web page backgrounds with a white background, which adds clarity to black-and-white prints. The PDF Creation Inspector contains many additional options, which you can use to embed multimedia ﬁles, optimize ﬁle size, and more. For more information, see

“PDF creation options” on page 351.

Using Help | Contents | Index Back 23

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 24

4. Smooth text, line art, and images.

To smooth jagged edges in text, line art, and images, select the appropriate Smooth options in the View palette.

Smoothing affects only on-screen appearance in Acrobat applications and is especially effective for large type.

5. Export the PDF ﬁle.

Click the Export button in the toolbar, and save the PDF ﬁle in your site folder.

If you plan to incorporate PDF ﬁles into a site, always save them in the site folder. In that location, you can manage PDF links with the same site management tools used for HTML links. For more information, see

“Editing links and URLs sitewide” on page 124.

6. Link to the PDF ﬁle from the Web page.

Click the Layout tab to edit the Web page, and add the text Print-friendly version in an appropriate location. Select the text, and link it to the PDF ﬁle by using the Text Inspector. Then save the Web page.

You’ve successfully incorporated a print-friendly PDF into your site. In the future, you can link from a Web page to speciﬁc PDF bookmarks or pages (see

“Linking ﬁles” on page 61).

You can also link from PDF ﬁles to destinations in your site and elsewhere on the Web (see

“Editing PDF link regions” on page 351).

Using Help | Contents | Index Back 24

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 25

Publish a site

Before visitors can view your Web site, you need to transfer it to a publish server (a server that hosts your site ﬁles, such as an FTP server). This tutorial demonstrates how to use GoLive to transfer your site ﬁles to a publish server for the ﬁrst time. Before you start this tutorial, contact your Internet service provider (ISP) to determine the settings you’ll need to access the publish server, including the publish server address, the server’s protocol, the location of your directory on the publish server, and your user name and password.

GoLive makes it easy to transfer your site to a publish server with the Publish Server tab in the site window. Once you’ve transferred a site, updating it is easy using modiﬁed-item uploads and synchronized uploads. GoLive takes the guesswork out of determining which ﬁles need updating by comparing the modiﬁcation dates of local ﬁles with those on the server.

1. Conﬁgure a publish server.

Open a site and choose Edit > Server (Windows) or GoLive > Server (Mac OS). Click New in the Edit Publish Server dialog box and type an easily recognizable nickname for your server in the Nickname text box (this prevents confusion if you add more than one server to the list). Choose a protocol from the Protocol menu and ﬁll in the Server, Directory, Username, and Password text boxes based on the publish server information you obtained from your ISP; then click OK. Click the Site Settings button on the toolbar, and choose Publish Server. Click Add and select the server you just conﬁgured. Click OK, and then click OK again to add the server to the site settings.

Using Help | Contents | Index Back 25

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 26

Once you’ve conﬁgured a publish server in GoLive, you can use it for any site. If you change information about the publish server in the Edit Publish Server dialog box, GoLive updates all sites that use that server.

2. Connect to the publish server.

Click the Connect to Publish Server button in the toolbar. GoLive brings the Publish Server tab in the site window to the front.

3. Upload a new ﬁle.

In the Files tab of the site window, select the ﬁle you want to upload and choose Site > Publish Server > Upload Selection (don’t select the home page of the site—you’ll delete this ﬁle later in the tutorial). GoLive uploads the ﬁle and displays it in the Publish Server tab.

You can use the Publish Server command to upload selected ﬁles, all ﬁles in your site, or only new ﬁles and ﬁles that have been modiﬁed locally since the last upload.

Using Help | Contents | Index Back 26

Adobe GoLive CS Help Tutorials

Using Help | Contents | Index Back 27

4. Upload a modiﬁed ﬁle.

In the Files tab of the site window, select and open the ﬁle you uploaded in step 3. Make a change to the ﬁle, and then save and close it. Click the Upload Modiﬁed Files button

on the toolbar (if the button tool tip reads Upload All or Upload Selection, click the triangle at the lower right of the button and choose Upload Modiﬁed Command from the Change Button To menu). In the Upload dialog box, note that the ﬁle you’ve just modiﬁed is marked with a green arrow, meaning GoLive will upload it to the publish server. Click OK to perform the modiﬁed-item upload.

When GoLive uploads ﬁles, it saves the modiﬁcation time for the local site ﬁles and the ﬁles on the server. When you perform a modiﬁed-item upload, GoLive compares the modiﬁ

cation times and transfers only new ﬁles and ﬁles that have been modiﬁed locally since the last upload.

5. Synchronize all ﬁles in the site.

In the Files tab of the site window, select the ﬁle you uploaded in step 3, and then click the Delete Selected Item button in the toolbar. Click Yes to conﬁrm the deletion. Click the Synchronize with Publish Server button

on the toolbar. The Synchronize dialog box appears and displays ﬁles on the local site and on the publish server. The ﬁle you deleted locally is marked with a Delete icon

. Click OK to delete the ﬁle from the publish server

and synchronize the site.

Synchronizing a site ensures that the local site and the site on the server match. When you synchronize a site, you can upload ﬁles to the publish server, download them from the server to the local site, skip ﬁles completely, or delete them. You can exclude ﬁles from upload by setting their publish state to Never in the File Inspector (see

“Assigning publish

states to ﬁles and folders” on page 133).

Using Help | Contents | Index Back 27

Adobe GoLive CS Help Looking at the Work Area

Using Help | Contents | Index Back 28

Looking at the Work Area

GoLive basics

The GoLive work area includes the site window (one for every site project), document windows for each open Web page, and a variety of editors, toolbars, and palettes for working with everything in your site. Windows can be stacked or tiled on your screen, and palettes can be grouped, ungrouped, rearranged on the screen, and saved as custom workspaces.

Dragging and dropping You can drag ﬁles around in the site window just like you drag ﬁles

on your desktop—but by dragging in the site window, GoLive continually tracks the ﬁles and updates ﬁle references in the site accordingly. You can drag ﬁles from the site window into an open Web page to add images, Smart Objects, site assets, or hypertext links to the page. You can drag text and objects from one page to another, and from one site to another.

GoLive work area A. Toolbar B. Objects palette C. Document window D. Inspector E. Library palette F. Site window

Using the Objects palette, you can drag objects representing HTML elements to an open page. You can drag text and objects from the page into the Snippets tab of the Library palette for storage with the site or application.

Using Help | Contents | Index Back 28

Adobe GoLive CS Help Looking at the Work Area

Using Help | Contents | Index Back 29

Using the point-and-shoot feature, you can create resource links (between object placeholders on the page and their source ﬁles) or navigational links (between the page and other pages or URLs) by dragging from the page or the Inspector to destinations in the site window or another open page. (See

page 61.)

If a window is hidden behind other windows, you can drag to the Select Window button to a tab on a window, GoLive brings the tab to the front of the window.

Starting the application When the GoLive application starts, an Intro screen appears by default that contains options to create a new page or a new site, open a ﬁle, or close the Intro screen. You can deselect the option to show the screen at startup and later reselect the option in the Preferences dialog box. (See

page 42.)

on the toolbar to bring the window to the front. When you drag a ﬁle or object

“Creating resource and navigational links” on

“Setting preferences for opening pages” on

Working with windows, palettes, and menus

When you ﬁrst start GoLive, several palettes are displayed by default in groups. You can move palettes between groups or to their own windows, collapse them into tabs on the side of the screen, arrange them so that multiple palettes share a single title bar, and resize them to make better use of your work area. You can save the way palettes are displayed as custom workspaces.

Tabs in the site window and graphical site views behave the same way as palettes; that is, you can rearrange and organize them into new groups.

The site window (with both panes open), the Objects palette, the toolbar, and the Inspector should always be open for building, revising, and uploading a site.

Displaying the site and document windows

You can display multiple site and document windows at a time—GoLive keeps track of the pages with their corresponding sites—so you can easily copy things from page to page and site to site.

To display the document window:

Open an XHTML or HTML page, or create a new page.

To display the site window:

Open the site project ﬁle (.site).

To collapse the site window to a single pane:

Click the double-arrow button at the bottom of the window. (To expand the site window to two panes, click the button again.)

To display the head section pane in the document window:

With the Layout tab selected, click the Toggle Head Section icon in the upper left corner of the document window (next to the Header label).

Using Help | Contents | Index Back 29

Adobe GoLive CS Help Looking at the Work Area

Using Help | Contents | Index Back 30

To display the source code pane in the Layout Editor:

With the Layout tab selected in the document window, click the Show/Hide Split Source icon

in the lower left corner of the window.

Note: You can also display the source code pane in the Frame Editor and Outline Editor.

To display the source code pane on the sides, top, or bottom of the Layout Editor:

Alt-click (Windows) or Option-click (Mac OS) the Show/Hide Split Source icon—each time you click, the pane moves to a new vertical or horizontal position in the window.

To display an editor or preview:

Click a tab at the top of the document window:

• Click the Layout Editor tab to add content to a document.

• Click the Frame Editor tab to create a frameset and lay out frames that display individual

Web pages.

• Click the Source Code Editor tab to work directly with your document’s source code.

• Click the Outline Editor tab to view source code in a hierarchical, structured view.

• Click the Preview tab to preview your document and test links in GoLive.

• Click the PDF Preview tab to export a Web page to PDF.

Displaying toolbars and rulers

The main toolbar appears below the command menus at the top of your screen. It contains buttons and pop-up menus that change depending on what you have selected in the work area. In addition to the main toolbar, the Source Code toolbar is available when you work with source code in the document window.

Note: The Version Cue toolbar to the right of the main toolbar has buttons that are available when you use Adobe Version Cue with GoLive. For more information, see

“Working with Adobe Version Cue managed projects” on page 45.

You can display horizontal and vertical rulers in the Layout Editor to help you place and resize objects on a page with precision. When you place an object, white areas on the rulers indicate the current position and size of the selected object. When you move the pointer in the document window, lines in the rulers move along to indicate the current position of the pointer.

To show or hide the layout rulers:

Choose View > Show Rulers or View > Hide Rulers.

To show or hide the main toolbar:

Choose Window > Main Toolbar. (A check mark next to Main Toolbar in the Window menu indicates that it is showing.)

To move the main toolbar:

Drag the lower left corner. In Windows, drag the toolbar by its title bar once it’s moved from its default position below the command menus at the top of your screen.

Using Help | Contents | Index Back 30

+ 468 hidden pages