Contribute is a program used to create basic webpages without a knowledge of html. These pages have been created with Contribute.

Get the Contribute installation cd from the Staff Resource Center. Install the Contribute software following the on screen instructions. There is an install shell to walk you through the process. You should have received the license information to register the software.

Once the software is installed you will need to set up your connection to the server.

1. Open Contribute
2. Select Create a Connection (if you don't see this option on the opening screen select Edit -- My Connections -- Create from the menu)
3. Using the connection wizard that comes up ... answer the questions
     a) Web address (url) of your site -- ie: http://hhh.gavilan.edu/username provided by MIS
     b) Click Next
     c) How do you connect to your server -- select SFTP
     d) Name of your SFTP server? -- hhh.gavilan.edu
        What is the SFTP username? -- username provided by MIS
        What is the SFTP password? -- password provided by MIS
     e) Click Next
     f) Complete your user information
     g) Click Next
     h) Review the connection information and use the back button to make any corrections you may need to make
     i) Click Done
4. You should now see the connection on your opening page. This allows you to connect to the server and your 'site' to make changes and create pages using Contribute.

Before you begin, make a plan. It is easier to construct a webpage from scratch based on a plan than it is to create it 'on-the-fly.'

Gather any images you want to include. Keep in mind copyright issues when considering using images in your webpages.

Open Contribute.

Select your 'website' from your Contribute Start Page.

Click the New button at the top of the page. 

Select Blank Web Page.

Fill in the Title page blank. This will be the title users see in the window title bar in the upper left corner of the browser window when viewing your page. This should be a short description of the page. The title of this page is Beginning Contribute.

Click OK.

You are now in the Edit mode and can start constructing your webpage.

Add a basic table to your page:

• Click Table from the toolbar.
  
• Set the number of rows and columns you want to include. You can always add rows later.
  
• Set the width of the table to 80% of the screen.
  Click on Specific width from the Table width options.
  
  
  
  Select percent from the dropdown box.
  Set the width to 80.
  
• If you want to see a border, set the Border thickness to 1 or greater. This sets the width of the border in 'pixels'. If you don't want to see a border, set the Border thickness to 0.
  
• Set the Cell padding to 5. This puts space between the edge of the table cell and your content.
  
• Set the Cell spacing to 5. This puts space between the cells.
  
• Click OK.

Complete your table by typing into your table. It will look something like this.

If you need to add rows, you can Tab from the last cell in the table. This will add a row below.

You can also add rows at any point in the table by using the Table menu.

Select Table from the menu.

Select Insert

Select Row above or Row below

If you want to add a heading to your table you can merge cells like this.

To Merge Cells.

• Select the cells you want to merge. Left click your mouse and drag to select the cells. OR Place your cursor to the left of the row you want to merge until you see a solid right facing arrow, left click your mouse.
  
• Place your cursor in the selected cells and right click. From the menu, select Merge Cells. OR Select Table from the menu and select Merge Cells.
  

Remember you can set the alignment of your text in each cell or all the cells by selecting the cell and using the Alignment icons from the toolbar.

You can also use different fonts, font sizes and styles using the font icons from the toolbar.

Note that there are only 6 basic font choices. These are the standard fonts that most browsers will be able to display. You want to make sure that what you see in the creation process will be what your end user sees once they are using their own computer and monitor.

Also note that you only have the option of Bolding and Italicizing text from the toolbar. This is because you want to limit your use of underlining to emphasize text since most users expect underlined text to be a link.

Link to an outside webpage.

• Add text you want to be the link.
  
• Highlight the text using your cursor and mouse.
  
• Select the Link icon from the toolbar.
  
• Select Browse to Web Page.
  
• Type or paste the web address into the Web address
  
  
• Select New Window from the Target Frame dropdown box. When you click on the link a new window will open to the new webpage.
  
  
• Click OK

Now let's add an image to our page. You can add this in your table or you can create a new table, or you can add it outside your table. It's up to you.

In order to add an image you will need to have it on your computer or on a portable storage device like a 3.5 inch floppy disk or a USB drive. So do your searching ahead of time in order to find and save any images you want to use.

To add an image.

• Place your cursor where you want to add the image.
• Select the Image icon from the toolbar.
• Select From My Computer.
• Browse to the image you want to add.
• Click OK.
• You should now see your image on your webpage.

To be accessible you will need to add a description for each image you use on your webpages.

To add a description.

• Place your cursor on the image and right click on the mouse and select Image Properties.
  OR
  Select the image using the left click on the mouse and select Format from the menu and select Image Properties.
• In the Image Properties dialog box, fill in the Description box with a description of the image. This will be read to visually impaired users.
• You can also add a border to the image. The default is a 1 pixel border. If you don't want a border edit this to 0.

In order to properly evaluate a webpage we recommend that students look for an author, contact information and a date last updated. This is used to determine authority for the information and currency of the page and information. So let's add that information to your page.

At the bottom of your page:

• Select the Right Alignment icon from the toolbar.
  
• Set your font size to 8.
  
• Insert your information like this
  Address of this page:
  http://gavilan.edu/tlc/ic/contribute1.html
  For questions or comments, contact Jo Anne Howell at
  jhowell@gavilan.edu
  
• Now set up the Last updated date. Type:
  Last Updated:
  
• Select Insert from the program menu
  Select Date
  
  Select the format you want to use
  Click Update automatically on save
  Click OK
  

To see the page on the Internet you will need to Save/Publish the webpage.

Click the Publish button at the top of the page.

You may be prompted with a message that your page is not linked. You will fix this later. Click OK.

Filename: The program assumes the title you gave the page at the beginning of this process will be the name of your page. We recommend that you follow a few basic rules when naming your file.

• Use all the same case, all uppercase or all lowercase. If you mix cases, you will need to enter the name exactly that way in the browser address bar.
  
• No spaces in the filename.
  
• Use a short but recognizable name so you will be able to find it in the future. ie: lectures may follow the pattern week1.html, week2.html, week3.html. Remember the filename must be unique in this directory.
  
• If you want the page to be the first thing people see in your directory you will want to name the file index.html. ie: hhh.gavilan.edu/instructorname/index.html. This would ensure if a student entered http://hhh.gavilan.edu/instrutorname in the address bar they would see the index.html page.
  

Create a basic webpage. Include a table, a link to an outside page, an image, an address and last updated information.