Adding Tables To Your Page:

Tables are a great way to organize information and to place objects exactly where you want them. In order to add a table to your page, have the palette open (Alt+2). Click on the table icon under the basic tab and drag over onto your page.

table icon

Your table will look like the image to the right. If you pull up your Inspector (Alt+1), you will see that it has changed to the Table Inspector, to control all aspects of your table. Now let's find out how to change the table to fit your needs. table

In your table inspector, there are two main sections, the first being the Dimensions section, the other being the Appearance section.
table inspector The dimensions section controls how many rows and columns you have, how wide or tall your table is, whether you want it to be wide in so many pixels, in percentages, or whether you want it to fit automatically to whatever is placed inside the table.

The Appearance section controls whether or not you want a border, if you want a color to your background, and what kinds of cellpadding and cellspacing you want. As usual, you must always hit enter after putting in your changes for them to apply.

The color section of the table works the same as when you chose your color before. From your color palette (Alt+3), select the color you want, and click and drag it over to the space in the table inspector that says color.


Creating Hyperlinks:

Creating hyperlinks out of images or text is very easy to do. First lets try text. Type something on your page, then highlight it. Make sure you have your Inspector on screen (Alt+1). Because you have text selected, your inspector will change to the text inspector. Now, in the upper toolbar across your screen, click on the link button to create a link.

link button

Your text will turn whatever color you have selected for your links, and the text inspector box will change to show a section that says URL and a box with "empty reference!" in it. In that box is where you will type the URL or address of the page you want the link to go to. Once you type the URL, hit enter, and you link will be created.

text link box

Linking an image works almost the same way, with some other modifications. Click on your image to select it, and click the blue link button at the top of your toolbar. Notice that your inspector has changed to the image inspector. On the first tab of the image inspector, the basic tab, you can see your image name is already in the source box.

image inspector

Now choose the tab across the top that says Link. Your box will change to look like this:

making an image a link

In the URL box, type the address that you want the image linked to, and hit enter. Your link is created!

If you notice now, your image has an annoying border around it that will remain there even when you publish your page. To remove this border, click the Spec. tab on the top of the image inspector.

remove borders and place alt tags

In the Border box, click the small box to the left, and it will place a check there. This means that you want to control the size of the border around your image. To have no border, place a zero in the box to the right. This removes the border while still keeping your image as a link. Also, below the border box is the Alt Text box. This is a good place to type a short description of your image. Many people browse the web with thier images off, and it's common courtesy to use this tag to tell them what the image is of. Now when someone places thier cursor over your image, it will give say whatever you have placed in this box.


Doing Mouseover Images:

Creating mouseover images with Adobe Go Live is very easy. First, you need to start with two or three images all of exactly the same size and width. With mouseovers, you can have the image change only when you run the cursor over it, or you can have it also change when you click on it, requiring three images. In this example, we will do a three image mouseover.

I'm starting with these three images, all of exactly the same size.

butterfly1 butterfly2 butterfly3

The first image will be the one you see on the page. The second will show only when the cursor goes over the image, and the third will show when you click on the image.

First, pull up your inspector (Alt+1), then pull up your palette (Alt+2). In the palette, navigate with the tabs across to the one that says "cyber objects". Then you will select the second icon, that says "button image", and drag it onto your page where you want your mouseover image to be. There will be a small green corner on the image icon, showing you that this is a cyber objects button.

cyber objects button

If you look to your inspector box, it has now changed to the "button inspector" to control all aspects of your mouseover button.

button inspector

In the first box, you need to give your first image a name. This can be anything you want, "home", "over", or the name of the image. It's up to you, as long as each image has it's own seperate name. You don't need any file extensions in this name, either. Once you have a name in the box, click on the first question mark icon that says MAIN. This is the image that people will see when the cursor is NOT over the image. When you have this box selected with the black mark around it, go to the browse button. (If the browse button is grayed out so you can't select it, check the small white box to the left of the larger white entry box. This will enable the browse button). Navigate to the image on your hard drive and select it. It will show the image in the main box, as a small thumbnail. Do the same for the OVER and CLICK images, making sure to give each one a name, and an image. Your final image will look like this: (*run your mouse over it!*)

If you want your mouseover image made into a hyperlink:

Once you have the mouseover images set up as above, select the image by clicking on it, then, in your Button inspector, click the second tab across the top that says Status and Link.

make the mouseover a link

In the second area of the box, where you see URL, check the small white box, and type the address you want your image linked to in the box, then enter or click the small black arrow. Your mouseover is now a hyperlink!

(Relative links vs. Absolute links: in the address above, there is no http://, that's because it is a link to a page within my own site, or a "Relative URL". If you're linking to a page withing your site that is not in another directory, you can link it this way. If you're linking to a page outside your own site, or an "Absolute URL", then you will need to type the complete address, http://www.mypage.com).

This is just a handfull of things that can be done to get you started on your way with Adobe Go Live. This program is full of things that I haven't even discovered yet.

Enjoy!

Still want more? Here is an advanced feature.