Introduction | Panels & Toolbars | Getting Started | Adding Text & Horizonal Lines | Adding Images
Adding Hyperlinks & Anchors | Basic & Advanced Table Editing | Saving & Publishing

Panels and Toolbars:
There are many panels in GoLive that control various tasks. The following is a breakdown of the major panels and toolbars, and their associated functions.

Toolbar:
Located underneath the menu bar is the Toolbar. This is what you use to edit basic text elements on your web page. As you will find out, this layout is very simple to ones you may be familiar with in word processing programs.

1. Paragraph Format
Applies a pre-existing paragraph format to a block of selected text. Selecting "None" removes a format from a block of text.

2. Align Left
Aligns selected text to the left.

3. Align Center
Center aligns selected text.

4. Align Right
Aligns selected text to the right.

5. Bold
Makes selected text bold.

6. Italic
Makes selected text italic.

7. Teletype
Applies a fixed width (teletype) format to selected text.

8. Text Size
Allows you to set a size for selected text.

9. Text Color
Right-click on the colored rectangle to bring up a color menu. From here, you can choose a color for selected text.

10. Numbered List
Creates an ordered (numbered) list of items.

11. Unnumbered List
Creates a bulleted (unnumbered) list of items.

12. Increase Level
Indents selected text on both sides of the page. Clicking on the indent icon multiple times sets the text farther from the edges of the page.

13. Decrease Level
Outdents selected text on both sides of the page. Clicking on the outdent icon multiple times sets the text closer to the edge of the page.

14. New Link
Turns selected text into a link. However, you must type out the link separately in the "Inspector" tab.

15. Remove Link
Removes a link from selected text.

16. Link Warnings
Alerts you when a link is broken or missing. You can add a link in the "Inspector" tab, or remove a link by clicking on the "Remove Link" icon.

17. Select Window
Clicking on this icon gives you a list of web pages that are currently open and being edited in GoLive.

18. Show in Browser
Previews the page you are currently editing in a web browser.

19. Adobe Online
Clicking on this button takes you to the main Adobe GoLive website.

Objects: Basic

1. Layout Grid
Using a layout grid allows you to make a simple layout for your web page. Just drag and drop the Layout Grid icon on to the page, and from there, make the grid as large as you want by dragging the handles on the grid's corners. You can then insert other objects into the layout grid once the grid is on the page.

2. Layout Text Box
If you want to put an area of text in your layout grid, then drag and drop the Layout Text Box icon anywhere on your grid, and adjust size as desired. Once it is inserted into the layout grid, you can type inside the text box, and modify the text using the Toolbar.

3. Floating Box
A "floating box" is actually a layer. A layer can be used on a web page to hold text, images, or nearly anything else. It can also be used to help design a layout for a page. Drag and drop the Floating Box icon on to the page to make a new layer. Drag the handles on the corners of the box to make it as big or small as you want. Click inside of the box to either type text or insert an image.

4. Table
Tables, which are made up of "cells" formed by rows and columns, can come in handy when designing a website. Tables can organize text and data, images, and can even help in designing a web page layout. When you drag and drop the Table icon on to your page, the table will be inserted wherever your cursor is place. If you have a Layout Grid on your page, inserting a Table in this area will give you more freedom for where the table can be placed. The default size for the table is three rows by three columns. You can change the properties of a table by opening the Table panel and edit the table there. For more information, please read the Tables section.

5. Image
Click and drag the Image icon to insert an image element on to the page. Once that is on the page, double-click the image icon to open up the Inspector panel, which will allow you to locate the image you want to insert on to a page by browsing your computer. For more information about inserting images on to a page, please read the Images section.

6. Plugin
If you have plug-ins that you wish to insert into your page, then drag and drop the Plugin icon on to the page, double-click the Plugin element once it's on the page, and then use the Inspector panel to locate the file on your computer.

7. SWF
SWF stands for "Shockwave Flash." You might have seen Shockwave Flash files on the Internet as short movies, games, or animations. If you have a SWF file on your computer that you want to insert into your web page, then drag and drop the SWF icon on to the page. Then, double-click the SWF element to open the Inspector panel, and locate the SWF file on your computer to insert it into the page.

8. Quicktime
Quicktime is a digital video format created by Apple. These movies have the file extension ".mov". If you have a Quicktime movie that you want to embed into a page, drag and drop the Quicktime icon on to the page, double-click the Quicktime element to open the Inspector panel, and then use that to locate the file on your computer to insert the movie on the page.

9. Real
Real is another type of video format. These movies have the file extension of ".rm" or ".ram". Drag and drop the Real icon on to the page, and use the Insepector panel to find the file on your computer to insert it into the page.

10. SVG
SVG stands for Scalable Vector Graphics. If you have a SVG file on your computer that you want to insert on to a web page, then drag and drop the SVG icon to the desired location on a web page. Then, use the Inspector panel to locate the file on your computer to complete the process.

11. Java Applet
Java applets add animation or advanced features to a web page. Insert the icon on the page, and use the Inspector panel to specify the java applet. Recommended for advanced users.

12. Object
The Object icon inserts a blank object into a page. Once it has been inserted, you can use the various menus and panels in GoLive, such as Inspector, to specify the object type.

13. Line
Inserts a horizontal rule (or "Line," as it's called in GoLive) in to a page.

14. Horizontal Spacer
Inserting a horizontal spacer creates an area of blank space before text.

15. Java Script
A java script is a type of program that can be inserted into a web page. It allows for higher user interactivity on a page, and can be used to create various site functions. If you have a Java Script you wish to insert into a page, drag and drop the Java Script icon on to the page, and use the Inspector panel to specify the script information.

16. Marquee
A marquee is a line of text that scrolls across the screen. Drag and drop the icon on to the desired location on a web page. Then, use the Inspector panel to insert text into the marquee, and specify the marquee properties and behaviors.

17. Comment
A comment is something you can use to make a note to yourself on a web page. The comment will not appear in the web page itself. It remains hidden inside the code. Drag and drop the comment icon on to the page. Use the Inspector panel to type in the actual comment.

18. Anchor
An anchor is a special link that links to another location on the same page. To learn more about this, please read the Anchor section.

19. Line Break
Inserts a line between separate paragraphs.

20. Tag
Insert a tag into a page, which you can then edit to specifically meet your needs.

21. i-mode Emoji
Inserts a special character, icon, or emoticon on to a page. When you drag and drop this icon into a page, a separate window will appear where you can choose the icon you want to put on to the page.

Objects: Smart

1. Smart Photoshop
Allows you to optimize an image for the web based on an image made in Photoshop.

2. Smart Illustrator
Allows you to optimize an image based on an image created in Illustrator.

3. Smart Generic
Allows you to add a Smart Object to a layout by dragging a source file into the Layout Editor. You can also specify the source file in the Inspector.

4. Component
Components are used to reference one or more elements stored in a single source file, such as logos, headers, mastheads, or other common navigation elements that you want to use throughout your site. Drag the Component icon to the page. Then, in the Inspector panel, specify the destination of the link by dragging from the Point and Shoot button to the component's source file in the Extras tab in the site window.

5. Rollover
Allows you to make an image rollover link. Use the Inspector panel to specify the images and URLs to be included in the rollover.

6. Modified Date
Inserts the date or time into a web page. Using the Inspector panel, you can modify the appearance of the date or time.

7. URL Popup
If your web site has several links or sections, you may want to present them as a pop-up. Drag and drop the pop-up icon into the page, and use the Inspector to specify the URLs and labels.

8. Body Action
Browser-triggered actions take place automatically as the result of browser activity or when the action is "called" (triggered) by another action. The Body Action takes place within the main content area (or "body") of a web page. Use the Inspector panel to choose an action.

9. Head Action
Browser-triggered actions take place automatically as the result of browser activity or when the action is "called" (triggered) by another action. The Head Action takes place within the <head> area of code of a web page. Use the Inspector panel to choose an action.

10. Browser Switch
Often times, a web page looks one way in one particular browser, while it looks another way in a different browser. Inserting the Browser Switch function allows the web browser loading the page and automatically redirects viewers to an alternate page based on their browser.

Objects: Forms

1. Form
Inserts a form area into a page. No matter what kind of form element you place on a page, a form area must be inserted first.

2. Submit Button
Inserts a "Submit" button on to a page. This lets the user submit a form to the server.

3. Reset Button
Inserts a "Reset" button on to a page. This lets the user clear any form he or she has filled out.

4. Button
Inserts a blank button on to a page. Using the Inspector panel, you can edit the name and function of the button.

5. Form Input Image
References an image to be used as a form button. Set rollover effects, alignment, and spacing.

6. Label
Inserts a text label that describes the purpose of a form field or value.

7. Text Field
Inserts a single-line text field for entering text into a form.

8. Password
Inserts a text field specifically for passwords. Values are hidden as they are entered into the field.

9. Text Area
A Text Area is similar to a Text Field, but is different in that is can contain multiple lines of text.

10. Check Box
Inserts a check box that lets users select one or more items from a list of check boxes/menu.

11. Radio Button
Inserts a radio button that lets users select one item from a group of radio buttons/menu.

12. Popup
Inserts a pop-up menu that contains a list of options. You can then specify the items you want to enter in the menu.

13. List Box
Inserts a menu with a list of items that users can scroll through.

14. File Browser
Inserts a text field and a "Browse" icon for viewers to reference a file when they wish to upload a file to a server.

15. Hidden
Inserts a value that is hidden from users in the browser and submitted with the form.

16. Key Generator
Sets up an encryption method that hides transactions on a web site.

17. Fieldset
Groups related form fields together.

Objects: Frames

1. Frame
Adds a frame to a row or column in an existing frame set. Set the size, scrolling and resize properties in the Inspector panel.

2. Frame Set: two cols, variable right

3. Frame Set: two rows, variable bottom

4. Frame Set: two cols, variable left

5. Frame Set: two rows, variable top

6. Frame Set: fixed left, variable bottom right

7. Frame Set: fixed left, variable top right

8. Frame Set: fixed right, variable bottom left

9. Frame Set: fixed right, variable top left

10. Frame Set: fixed top, variable bottom right

11. Frame Set: fixed bottom, variable top right

12. Frame Set: fixed top, variable bottom left

13. Frame Set: fixed bottom, variable top left

14. Frame Set: three cols, variable middle

15. Frame Set: three rows, variable middle

16. Frame Set: three cols, variable left and right

17. Frame Set: three rows, variable top and bottom

>> next