Uploading Images in Site Builder

For more information on uploading images, creating links, and managing your content, see the "Sitebuilder Manual".

NOTE: Only files of the following types are allowed to be uploaded to the server.

• ".jpg" (Image files)
• ".doc" (MicroSoft Word)
• ".pdf" (Adobe Acrobat)
• ".xls" (Excel)
• ".txt" (Ascii Text)

1. Login to the Site Builder Toolkit (http://www.lincolnu.edu/login)
   
2. Enter your username and password.
3. Once you have successfully logged in, you will be taken back to the main home page. This page will look just as it did before logging in with the exception of a couple of added icons:
   
   On the right side of the screen, you will see a key icon along with the name of the logged in user. The key icon is your logout button. Clicking it will log your out of the editing mode and return you to the log in screen.
   
   Go to the page you would like to edit. On that page, click the Edit a Page icon  in the middle of the page footer or header.  This will take you to the page editor and allow you to make changes to that page.
    
   (If the icon doesn’t appear you may not have permission to edit the page. Check with your local webmaster to remedy this.)

4. To display an image on the website it will first have to be uploaded to the server:

To upload an image to the server:

1. Make sure you are on the Pages tab.
2. Click on the “Main Content” sub-category under the Pages tab.
3. Click the Insert/Edit image icon
4. The image properties dialogue box will open. Click on the browse server button.
5. A file browser window will open. Go to the Resource Type drop down menu located at the top left corner of the file browser display window. Click on the drop down menu and select Images.
6. Once Images has been selected, click on the folder that contains the files for the area you are editing (i.e. – KJLU folder if you are editing KJLU’s web pages.)
7. Go down to the bottom right corner. Click on Browse to locate the picture on your local computer.
8. Once the image has been located on your local computer, click Open
9. After you click Open the window will close and take you back to the file browser window. Now click upload to upload it to the appropriate folder on the server.
10. Your picture has been uploaded

5. Search the file browser to find the uploaded image in the folder.
6. Once found, click on the image file name to select the image.
7. This will automatically close the File browser window and display Image Properties.
8. Enter a description of the image in the Alternative Text box (i.e. – Photo of the maintenance building.) This is required to comply with the American with Disabilities Act; people who use screen readers need this information in order to know what you have inserted because they can’t see images.
9. Specify options for the layout and alignment of the image:

1. Border: The border around the outside of the photo. The scale begins at 0, meaning no border. The higher the number, the wider the border.
2. HSpace: (Horizontal Space) Numbers designate the space that will be inserted on the left and right sides of the image on a scale beginning with 1. The width of the space increases if larger numbers are entered. This creates a padded area between the image and any other images and/or text that may be beside it.
3. VSpace: (Vertical Space) Numbers designate the space that will be inserted above and below the image on a scale beginning with 1. The width of the space increases if larger numbers are entered. Used for the same reasons as HSpace.
4. Align: Lets you specify how you want the image to display in relation to other elements (images and/or text) on the page. If you click the drop down and choose “Left” the image will display to the left of any text that is around it.
10. Click OK when you are finished to insert the picture onto the page you are editing.
11. Click on PUBLISH to display changes made on the page.

REFRESHER:  CREATING A HYPERLINK To insert a hyperlink into a page, highlight the text or graphic that you want to make into a hyperlink and click on the insert hyperlink button (that looks like the link of a chain).  When the hyperlink properties box opens, paste the URL of the link (that you copied from the confirmation page) into the ‘URL:’ text field. The 'target' text field can be populated with an 'underscore new' ( _new ) to open the link in a new browser window.  This should generally be done when linking to a file.