Macromedia Contribute is designed to enable people with little or no web experience to update content on a web site. All you need are basic computer skills. In this tutorial we will go step by step through updating pages, modifying text, inserting images and more.
Important: This tutorial assumes that you already have a connection to your web site set up in Contribute. If you do not, please contact the web site administrator for your area.
Let's start with the basics. Everything that you do in Contribute can be summed up in three basics steps.
In this section we will go through each of these steps in detail. Later on in this tutorial you will learn more advanced features.
Contribute provides you with a number of ways to navigate to the page you want to edit. Probably the easiest way is to browse to that page using the address bar.
You can either type in the complete address, or you can use Contribute's browser to navigate to the page you want to edit. Important: If you see an error message that says "you can't edit this page because it wasn't found on the web site or is a directory listing," make sure you type the full path into the address bar. Contribute does not recognize directory listings (Example: http://www.regent.edu/). You need the full path to the page (Example: http://www.regent.edu/home.cfm).
If you see the error message "You are viewing a page on a web site that you haven't created a connection to," this means that you do not have access to update this page. If you encounter this message on a page that you should be able to update, please contact your web site administrator.
You can also select pages from the directory. To do this, click the "Choose" button to the right of the address bar. This allows you to select a specific file from a directory on your site.
Once you have navigated to the page you wish to modify, click the Edit Page button above your browser window.
Or if you selected a page using the choose file dialogue box, click OK.
The Contribute interface changes to editing mode.
Now you can make changes to the page you are updating.
In many respects, editing a web document in Contribute is similar to editing a Microsoft Word document. We will learn more detailed editing features later. For now, notice that you can edit the document just like you would in a word processor. You can
When you have finished updating the document, click "Publish" to save your changes.
These changes will now be visible when someone next visits this page on Regent's web site.
You also have the option to Send for review, Save for Later, and Cancel.
"Send for Review" enables you to email someone else a link to a draft of your page without publishing it.
"Save for Later" allows you to save the draft of your page and come back to work on it at a later time. If you choose this option, when you next edit this page Contribute will reload your previous draft so that you can continue editing where you left off.
Finally, choosing "Cancel" will discard all of your changes without publishing them to the web.
Now that you have the basics in hand, let's move on to specific tasks.
In this section we will discuss some of the options you have for editing text in Contribute. When you are editing a page, you will see the familiar options for selecting a font family, color and styles, and choosing bold or italics. Also, from the style menu you can choose any style that is currently set up on your site. For example, I am going to insert my cursor inside my sample heading and choose the "pagetitle" style.
This automatically changes my entire heading to this style.
Now I will select the center button (highlighted above) to move my heading to the center of the page.
You can also access all of your text editing options from the format menu.
Links allow users to interact with a page by quickly going to other pages, downloading files, or sending email to a specific address. In this section we will learn how to create links to other web pages, files, email addresses and even new pages.
In the center of your toolbar is the insert link button.
When you click this button you will be given several options.
We will go through each one at a time.
The most common link is to another page on the Web. To create this kind of link choose "Browse to Web Page." This will open the insert link dialogue box.
In the Link text field, enter the text that you would like your link to display (Example: "Regent University"). The web address is where the link will take the user when they click it (Example: http://www.regent.edu/home.cfm). You can find this page by browsing to it using the "Browse" button, choosing it from the files on your web server, or typing the address in directly.
At the bottom of this box is an Advanced button which enables several more options. For example, you can use the target frame drop down menu to cause the link to open a new browser window, or to fill the entire window.
When you are finished entering the required information (at least the web address and the link text), press OK to create the link on your page.
Contribute will create your link where your cursor was positioned when you clicked the Insert Link button.
Now that we've been over basic links, let's go over the other options that you have.
If you choose, "Drafts and Recent Pages" Contribute will display a list of recently edited files or drafts. This works exactly like linking to a web page, except that you choose your page from the menu.
To create an email link, from the Insert Link button menu, choose "Email Address."
This will open a dialogue box very similar to the one we just saw, except that now instead of a web address you need to enter an email address. Click OK and your email link will be created on the page.
Note: Once you are inside the Insert Link dialogue box you can choose the different link options using this navigation bar at the top of the window.
You can use Contribute to link to a file that is located on your computer. When you do this, Contribute will upload your file to the server automatically.
As you can see, this is similar to the other links we have discussed. Here, you enter in the text you want your link to display, and then choose browse to locate the file on your computer, and click OK.
Important: If you want to modify a document later on, you must browse to it from within Contribute. Changing it on your computer will not update the document on the web.
You can also link to a new page. This option allows you to create the link and the new page at the same time. Choosing "create new page" from the link menu will open a menu where you can specify what kind of page you want to create.
To start from scratch, select "Blank Web Page." and give your new page a title. You may also create a new page from a template, if your site is set up with templates. If so, you will see files in the templates folder.
Creating a new page from a template will set up parts of the page (such as the navigation or page header) automatically for you. Also, the template may allow you only to edit certain parts of a page, known as editable regions. If you are editing a page created from a template, it will look like this.
On this template, you can only edit the area contained in the "Content" box. All of the other elements on the page are static.
When you choose what type of new page you want and click OK, Contribute will automatically save a draft of your current page and open your new page for editing.
One very useful way to create a new page is to create a "copy" of the current page. To do this, use Contribute's browser to navigate to the page you want to copy. Do not go into editing mode. Instead, choose "new page" from the file menu.
This will open a window very similar to the link to a new page window. However, you now have the option to create a new page based on a copy of your current page.
This is very useful if you need a page that is very similar to another page. Contribute will do most of the work for you!
If you use this method to create a new page, remember to make sure you have another page that links to it. Otherwise users of your site will not be able to find your new page.
To insert images into your web document, use the insert image button in the toolbar.
When you click this button you have two options. You can insert a picture that is located on your computer, or select an image from a folder on the web site. If you choose to insert a folder from your computer, you will see a window where you can navigate to the location of that image on your computer.
When you select an image, Contribute will automatically upload that image to the web site for you.
If you choose to insert an image from the website, you will see a slightly different window where you can navigate to the correct folder and select your image.
Once you have inserted an image in your page, Contribute has built-in image editing features that enable you to adjust or change your image. When your image is selected, you will see an image editing toolbar displayed.
This toolbar gives you access to some common image editing features, including:
You can also specify the width and height of your image and its alignment on the page. If you change the width, Contribute will automatically change the height of your image to maintain its current proportions, and vice versa.
Note: Avoid making your images larger than their original sizes, as this will degrade their quality.
To view the image properties, click the image properties button on the far left of this toolbar.
This will open a window where you can control detailed settings for your image.
You can specify a horizontal and vertical padding that will cusion the image from other elements (such as text) on the page.
You can specify an alignment of left, right, or center. This will cause text to flow around an image.
You can also specify a border by entering a number into the border field. For example, entering "1" here will give the image a one pixel wide border.
The Description (ALT text) is the text the browser will display while an image is loading, if the user has images disabled, or if a user visits your site with a non-visual browser. It is generally a good idea to give all of your images an Alt description. For example, the above screenshot has an Alt description of "image properties window."
Tables can be very effective at organizing information on your web page. Here is an example of a table on a web page.
As you can see, the cells in the table are outlined with very small dots. This is only to show you where the table is. These will not be visible once the page is published unless the table has a border.
A table with a border will look like this:
To create a new table, click the insert table button.
This will open a window where you can specify information about the table you want to create.
Here you can specify the number of rows and columns your table will have, a specific size (if desired) and whether your table will have a border. You can also specify the amount of padding and spacing that the cells within your table will have. Padding is useful if you want to move your content away from the edge of a cell. Spacing will increase the distance between two cells. Finally, you can designate a top, left, or both header for your table.
This is what a header looks like.
If there is already a table on your page, you can add rows or columns to that table using the "Insert Row Below" and "Insert Column to the Right" buttons.
For more options, you can use the Table > Insert menu.
You can also use this menu to split a cell into multiple rows or columns, and access the individual table and cell properties.
Contribute provides you with several options to make your tables attractive and organized. It can take a basic table, such as the examples in the previous section, and make them more visually attractive very easily.
With the cursor in any part of a table, select "Format Table" from the table menu.
This will open a window where you can select a design from a list of already created designs.
As you scroll through the list you can see a preview of what your table will look like if you choose that design. You also have the ability to set advanced options for your table. To use this click the Advanced tab at the top of this window.
In this window you can specify the exact color and style for your rows, columns and headers. When you click OK they will be applied to your entire table. You could for example, leave all options blank except to have your tables alternate between a white and a light gray color, which is a common design technique used to make tables easier to read.
Contribute also provides a quick and easy way to organize information in your tables. You can use this to quickly alphebetize words in a column, for example.
To use this, choose "sort table" from the Table menu.
This will open a window where you can specify how you want Contribute to sort your table.
You can choose which column you would like to sort, and whether you would like to sort alphabetically or numerically. The "then by" fields specify how contribute will sort if it finds no difference in two cells of the first column. For example, if there were another "C" row in the left column above, it would then sort by these criteria.
By default, Contribute will not sort the first row, header or footer rows in a table. To sort these, click in their respective checkboxes. Also, check "Keep row colors with content" if you want the color of each row to stay the same when it moves.
The above settings would sort the table like this.
Notice that the entire C row moved down to the bottom, not just the individual cell.
Thank you for completing the Regent University Contribute 3 tutorial. Visit http://www.regent.edu/it/training/contribute/feedback.htm to let us know what you thought.